![](https://img-blog.csdnimg.cn/20201014180756930.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue2
文章平均质量分 81
对vue2的认识和部分语法
学习吖
凌晨四点钟,我看见海棠花未眠
展开
-
首页 startsWith() 更换头像 上传头像 转换base64 一级二级菜单栏实现跳转 拦截器
在methods中定义函数 发送ajax请求 请求成功将 数据 保存在menu中在data里面定义属性名 menu为数组 用来接收保存ajax请求到的数据在created里面 调用 methods的函数 初始数据用template标签包含 将 v-for循环绑定在 template标签上 将:key绑定在 一级菜单上(template是语义化标签所以:key不能绑定在他上面)循环遍历 v-for 不含子菜单的一级标题 更换数据进行 if 条件判断 判断该标题是否含有children 元素 是否为二原创 2022-06-14 21:55:51 · 417 阅读 · 0 评论 -
默认插槽 具名插槽 作用域插槽 自定义指令-注册 $refs $nextTick v-model本质
组件内用占位使用组件时夹着的地方, 传入标签替换slot 子组件在子组件里面写入slot 占位具名插槽 子组件内slot的name属性起插槽名, 使用组件时父组件使用子组件时使用配合#插槽名传入具体标签父组件 子组件 作用域插槽 子组件, 在slot上绑定属性和子组件内的值使用组件, 传入自定义标签, 用template和v-slot="自定义变量名"scope变量名自动绑定slot上所有属性和值作用域插槽在element-ul使用较多通过props属原创 2022-06-06 23:58:26 · 330 阅读 · 0 评论 -
基于vue-element-admin 中的Excel的导入和导出 xlsx插件
excel的导入工作安装插件element-ui安装插件 xlsx 2. 找到 components/UploadExcel/index.vue 将整个UploadExcel文件夹复制到 excel_demo项目的 components目录下 3. App.vue内容覆盖为 效果如下 给导入绑定点击事件跳转页面在employee.js中定义接口函数 在import.vue中定义函数 发送请求 实现批量导入对Excel的时间进行格式化处理 定义函数发送请求 获取员工数据实现批量导入 导出 n原创 2022-07-10 11:30:19 · 1850 阅读 · 1 评论 -
新增公司管理页 分页设置 新增功能 删除功能
新增公司管理页 配置路由分页设置在api新建settings.js中定义接口函数在settings.vue中 定义函数 发送请求表格的渲染数据 分页功能的实现current-page修改当前页 删除功能在setting.js定义接口函数deleteRole 参数为路径(路径 在路径后传`/${id}`) 在setting.vue文件中 按需导入接口函数 通过插槽#default="{row}传数据" 删除按钮绑定点击事件 询问框 新增的对话框设置新增功能给确定按钮绑定hSubmit兜底校验定义接口函数 调原创 2022-06-23 22:03:33 · 231 阅读 · 0 评论 -
员工管理 封装组件全局注册 sortable数据升序处理 枚举取值三种方法 删除操作 新增员工操作
新建员工页在下面补充创建 ,内容如下:引入插槽让用户能自定义内容使用组件设置,内容如下: 全局注册使用全局注册方法二 封装自己的组件在components组件新建index.js 组件用于封装 信息在main.js中注册自己的组件 页面一加载获取员工信息发送请求定义接口函数 在employees.js中定义接口函数调用接口 在employees.vue中调用接口渲染表格 在 绑定信息 通过sortable实现对数据的升序和..................原创 2022-06-27 14:39:26 · 251 阅读 · 0 评论 -
新增功能 编辑功能 数据回填 显示详情不准确的三种修复方式 控制统一弹窗 删除功能 表单校验
扁平化数据处理树形结构续新增弹层的实现完善新增和编辑为一个弹窗新增状态 处理新增和编辑弹窗状态 给编辑部门添加事件 弹窗获取id 传给子组件 在子组件中 根据id获取单个部门信息 实现数据回填 做数据回填时,由于form已经做了v-model双向绑定,所以,这里直接赋值:,这样数据就回填了。图解 图解async为微任务微任务 =>dom加载 => 宏任务加$nextTick或setTimeout 将微任务转宏任务表单重新加载 重新获取数据 方法一 方法二 通过给组件添加ref $nextTick原创 2022-06-23 00:02:17 · 556 阅读 · 0 评论 -
vue项目打包优化的方法
项目上线前对项目进行极致压缩的方法将20MB文件压缩为20KB优化项目运行速度原创 2022-08-15 11:18:55 · 7818 阅读 · 20 评论 -
vue基础 动态class 动态style 计算属性computed 侦听器 品牌管理案例
1.动态class用v-bind给标签class设置动态的值语法: :class="{类名: 布尔值}" 2.动态style给标签动态设置style的值语法:style="{css属性名:值}"原创 2022-05-30 17:00:23 · 1828 阅读 · 0 评论 -
promise eventloop事件循环队列 常见的宏任务和微任务
导入分为默认导入和按需导入按需导入的优点是需要什么导入什么,减少不需要的代码的冗杂 promise用来解决回调地狱then =>成功时的回调error=>成功和失败都会走的回调catch=>失败时走的回调 2.默认导入 输入的变量名可以自定义按需导入 变量名不能随意修改 必须和导出的文件名保持一致............原创 2022-06-05 22:10:22 · 62 阅读 · 0 评论 -
脚手架下载 vue指令 v-指令 v-model v-for v-on v-bind v-show/v-if
yarn工具命令下载yarn npm i yarn脚手架-创建项目-启动服务选择淘宝镜像源1.创建项目 vue create vuecli-demo 回车2.选择vue23.选择包管理器 yarn或者NPM4.等待下载脚手架项目5.切换脚手架项目下 cd vuecil-demoyarn serve 看到绿色就OK了问题1 如何切换到淘宝镜像源 .c盘用户找到 .vuerc输入{ "useTaobaoRegistry": true,...原创 2022-05-26 21:39:23 · 709 阅读 · 0 评论 -
全局 /局部注册 组件通信 父向子传值 子向父传值 scoped作用
全局入口在main.js, 在new Vue之上注册引入axios 全局设置 以及全局设置基地址 全局注册局部注册scoped用法 子组件原创 2022-06-04 21:51:57 · 111 阅读 · 0 评论