转自：https://blog.51cto.com/u_15061951/4263737 原来的没有封装的代码： <FormItem label="适用胸型" prop="chestShape"> <S…
【原创】Vue 项目上线配置
通过 Node 创建 Web 服务器 创建 node 项目，安装 express，通过 express 快速创建 web 服务器。 创建项目文件夹 vue_test，在该文件夹下运行 npm init 初始化。 创建 a…
【原创】Vue 项目优化
为项目添加 loading 效果 使用 nprogress 包。 安装：npm install --save nprogress 导入并使用 main.js import NProgress from 'npr…
【原创】lodash 中的 cloneDeep 用法（深拷贝）
使用场景 例如做商品添加时，分类id需要传值 1,2,3 的形式，但基于计算或判断方便，在form 的 cateId 字段绑定的是数组，并且该字段参与了 validate 校验。 待商品添加调 API 接口时，需对该字段…
【原创】Vue 中使用 echarts
引入 import * as echarts from 'echarts'; 页面 <div id="main" style="width: 600px; heig…
【原创】Vue 时间过滤器
Vue.filter('dateFormat', function (originValue) { const dt = new Date(originValue); const y = dt.get…
【转载】Vue 校验邮箱和手机号
// 自定义校验规则 -- 验证邮箱 // rule:校验规则, value:校验的值, cb:回调函数 var checkEmail = (rule, value, callback) => { // 验证邮箱的…
【转载】box-shadow(盒子阴影)
转自：https://www.cnblogs.com/libo-web/p/15705558.html box-shadow 属性可以设置一个或多个下拉阴影的框 可以在同一个元素上设置多个阴影效果，并用逗号将他们分隔开。…
【原创】Vue 项目实战之用户管理
用户列表高亮问题 用户列表作为 home 组件的子组件，被点击时并不会高亮。 menu 组件有一个 default-active 属性，可以设置高亮链接，值为当前激活菜单的 index。 单击时高亮 &&…
【转载】CSS flex布局（弹性布局/弹性盒子）
转自：http://c.biancheng.net/css3/flex.html Flex 是 Flexible Box 的缩写，意为“弹性布局”或者“弹性盒子”，是 CSS3 中的一种新的布局模式，可以简便、完整、响应…
【原创】Vue 项目实战之主页布局
使用布局组件 home.vue <el-container> <el-header>Header</el-header> <el-container> <el-asi…
【原创】阿里图标库的使用
使用步骤 进入阿里巴巴图标库网站 http://www.iconfont.cn/ 搜索想要的图标 选择需要的图标加入购物车 右上角找到购物车的图标将图标，点击添加至项目，放到项目中，之前没有项目要新创建一个 在所在项目中…
【原创】Vue 项目实战之登录和注销
清除无用代码和组件内容 安装 Vue-Router npm install --legacy-peer-deps vue-router@3.5.2 文件代码 main.js import Vue from 'v…
【原创】Vue 2 安装 Vue-Router 失败的解决办法
错误信息内容： npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm ERR! While res…
【转载】Vue 电商后台管理系统
转自：https://www.jianshu.com/p/0ef4dc905e07 电商项目概述 如何运行项目 代码地址：Vue 电商后台管理系统 运行服务端接口项目（vue_api_server） 接口文档地址：htt…
【原创】Vue 项目实战
创建项目 使用 vue-cli 初始化项目 vue create proname 需要 node + webpack + 淘宝镜像 项目目录说明 node_modules : 项目依赖目录 public : 一般放置静态…
【原创】Vue 常用组件库
移动端常用 UI 组件库 Vant Cube UI Mint UI PC 端常用组件库 Element UI IView UI NutUI Element UI 引入全部 main.js import ElementUI…
【原创】Vue 路由其他
<router-link> 的 replace 属性 作用：控制路由跳转时操作浏览器历史记录的模式。 浏览器的历史记录有两种写入方式，分别是 push 和 replace，push 是追加历史记录,repla…
【转载】JS 单例模式及应用场景
转自：https://cloud.tencent.com/developer/article/1497022 单体模式(Singleton Pattern) 概念介绍 单体模式(Singleton Pattern)的思想…
【原创】Vue 路由传参
query 参数 传参 字符串写法 <router-link :to="`/home/message/detail?${m.id}&${m.title}`">跳转</rout…
【原创】Vue-Router
什么是 Vue-Router Vue-Router 是 Vue 的一个插件库，专门用来实现 SPA 应用。 什么是 SPA 单页面 Web 应用（single page web application） 整个应用只有一个…
【原创】Vue 插槽
插槽的作用 让父组件可以向子组件插入 HTML 结构，也是一种组件间的通讯方式，适用于父组件===>子组件。 插槽的分类 默认插槽 // 父组件中 <Category> <div>html …
【转载】Css 性能优化
转自：https://zhuanlan.zhihu.com/p/376816600 不使用 @import，会增加加载时间。 选择器尽量少于三层，太多层不利于后期维护，可读性也比较低。浏览器读取选择器是从右到左的顺序，最…
【原创】Vue 全局事件总线 Global Event Bus
全局事件总线 可以实现任意组件间的通信。 new Vue({ el:'#app', render:h=>h(App), beforeCreate(){ Vue.property.$bus = t…
【原创】Vue 组件化编码流程
编码流程 拆分静态组件：按照功能点拆分，命名不要与 HTML 元素相冲突。 实现动态组件：考虑好数据组件的存放位置，数据是一个组件在用，还是一些组件在用。 1.一个组件在用，放在自身即可。 2.一些组件在用，放在他们共同…
【转载】Vue 组件通信的几种方式
转自：https://blog.csdn.net/piaojiancong/article/details/122861309 组件是需要通信的，在开发中，常用到的通信方式有：vuex、eventBus、以及props与…
【原创】Vue 的生命周期
Vue 的生命周期 什么是生命周期 生命周期又名生命周期回调函数、生命周期函数、生命周期钩子。 Vue 在关键时刻帮我们调用的一些特殊名称的函数。 生命周期函数的名称不可更改，但内容是根据开发者的需求编写的。 生命周期函…
【转载】节流和防抖的区别
转自：https://blog.csdn.net/m0_59634149/article/details/123409912 防抖和节流本质是不一样的。防抖是将多次执行变为最后一次执行，节流是将多次执行变成每隔一段时间执…