vue大型电商项目尚品汇(后台篇)day04
昨天太晚就没来得及更新,今天是spu管理界面,这个界面一共有三个界面需要切换,完成了两个界面,而且今天的难度在于最后两个章节,富有一定的逻辑性,当然中间也有很多需要注意的,比如ElementUI的照片墙需要添加list属性而且值为你的数据并且必须是一个数组必须有name、url属性 一.spu管理 ...
vue大型电商项目尚品汇(后台篇)day02
这几天更新有点小慢,逐渐开始回归状态了。尽快把这个后台做完,要开始vue3了 3.添加修改品牌 用到组件 Dialog 对话框,其中visible.sync这个配置是修改他的显示隐藏的,label-width是这个标题的宽度 然后上传头像的按钮,upload组件,他有自己的一些样式记得复制在styl ...
记录--vue3中的ref,toRef,toRefs
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 1. ref的使用 ref 接受一个原始值,返回一个具有响应式的对象,对象有一个value属性,其值就是所传递的原始值。 ref是做的一个拷贝关系,修改对象msg的值,不会影响对象obj,视图会发生变化。 import { ref } f ...
记录--vue脚手架
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 一、vue脚手架 1.简介 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。 2.命令行操作步骤 npm install -g @vue/cli 安装3.x版本的vue脚手架 vue -V 测试是否安装成功 vue cr ...
记录--vue组件划分的思考
这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 对vue项目来说,组件是构成项目的基本单元,为了方便理解,这里定义两类组件:页面组件,功能组件。为什么需要划分这两类组件是从组件复用来考虑的。 我们知道在复杂应用中,页面状态管理早已不是早期的简单的子父组件的传值,兄弟组件传值。而当我们寻 ...
基于 Hexo 键入搜索功能
原文链接: 基于 Hexo 键入搜索功能 前言 本站基于Hexo搭建,用的 🦋 hexo-theme-butterfly 主题 v3.7.1,请注意最新的🦋 hexo-theme-butterfly 版本已经更新到 v4.2.2 。 如果你是 v3.7.1 之外的版本,可能有些地方会有出入,请留 ...
如何用纯CSS绘制三角形
视频链接: 如何用纯CSS绘制三角形 - Web前端工程师面试题讲解 首先先看一下例子: 1.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" ...
推荐Vue解决跨域问题比较实用的2种方法
首先我们必须要了解在什么情况下会出现跨域问题,即:当前页面的所在的源去请求另一个源的数据导致被提供接口的服务器拒绝 解决跨域的方式方法有很多种,例如script标签、jsonp、cors跨域资源共享等 这边为大家推荐两种比较实用的方法如下 1. webpack配置反向代理,首先可以在项目根目录中创建 ...
Vue+Mockjs如何模拟curd接口请求
在前后端分离的项目中常常会遇到当前端页面开发完成 但是后端接口还没好,暂不支持联调的情况下,一般我们会用到mock数据 这边简单说一下最常见且经常会遇到的curd接口模拟 注:这边可以和后端先约定好接口路径以及入参返参的字段,避免二次修改 安装依赖,新建js文件,在文件中导入mock.js,模拟列表 ...
拓展运算符是深拷贝还是浅拷贝
对于拓展运算符是深拷贝还是浅拷贝网上怎么说的都有,我就说一下我的理解。 什么是深拷贝?什么是浅拷贝? 假如B复制了A,修改A的时候,看B是否发生变化: 如果B也跟着变了,说明是浅拷贝,拿别人手段! 如果B没有改变,说明是深拷贝,自食其力! 怎么判断拓展运算符是什么拷贝呢? 看一下下面的例子: let ...
一文搞定Vue2组件通信
vue 组件通信方式 父组件将自己的状态分享给子组件使用; 方法:父组件通过子标签传递数据,子组件通过 props 接收 子组件改变父组件的状态; 方法:父组件在子标签上通过@abc 提供一个改变自身状态的方法,子组件通过$emit("abc", payload)触发这个函数 父组件直接改变子组件的 ...
Vue 配置代理
说明:这里的vue代理是指用vue静态服务器做代理。使用的是 http-proxy-middleware 这个模块(这个模块相当于是node.js的一个插件)。 版本: vue-cli 3.0以上 修改文件位置:根目录下的vue.config.js 代码: devServer: { proxy: { ...