vue
vue学习,记录
ฅQSω[*邱╭
看破红尘、宠辱不惊、淡泊名利、心静如水、清心寡欲。
展开
-
vue中使用layui
vue中使用layui原创 2023-05-04 14:34:21 · 615 阅读 · 1 评论 -
若依框架如何新增自定义主题风格
若依框架如何新增自定义主题风格原创 2023-02-16 16:10:27 · 2580 阅读 · 14 评论 -
查找字符串中某个字符在字符串中第几次出现的位置
查找字符串中某个字符在字符串中第几次出现的位置原创 2023-02-08 15:29:24 · 592 阅读 · 0 评论 -
Array.apply(null, { length: 20 })的理解
Array.apply(null, { length: 20 })的理解原创 2023-02-06 18:00:14 · 94 阅读 · 0 评论 -
vue表单重置新写法学习-this.$options
vue表单重置新写法学习-this.$options原创 2023-01-28 09:53:34 · 194 阅读 · 0 评论 -
vue-模板定义的替代品理解
vue-模板定义的替代品理解原创 2023-01-19 09:38:17 · 103 阅读 · 0 评论 -
vue-循环引用感想
vue-循环引用感想原创 2023-01-18 17:17:48 · 601 阅读 · 0 评论 -
vue依赖注入
vue依赖注入原创 2023-01-17 17:37:25 · 288 阅读 · 0 评论 -
js中的call和apply
js中的call和apply原创 2023-01-09 16:25:22 · 390 阅读 · 0 评论 -
vue2 composition-api setup 中如何使用 vuex3.1.0 mapState
vue2 composition-api setup 中如何使用 vuex3.1.0 mapState原创 2023-01-09 15:12:29 · 173 阅读 · 0 评论 -
elementui解决input show-word-limit挡住文字问题
elementui 怎么解决input show-word-limit挡住文字原创 2022-12-08 17:37:31 · 3447 阅读 · 0 评论 -
elementui tree组件自定义内容,实现移入label显示操作按钮
elementui tree组件自定义内容,实现移入label显示操作按钮原创 2022-11-03 12:01:58 · 625 阅读 · 0 评论 -
某个盒子模型实现不可点击(pointer-events: none)且有禁用样式(cursor: not-allowed)(避坑)
某个盒子模型实现不可点击(pointer-events: none)且有禁用样式(cursor: not-allowed)(避坑)原创 2022-10-19 17:55:52 · 609 阅读 · 0 评论 -
elementui inputnumber组件清空后显示一个默认值0
elementui inputnumber组件清空后显示一个默认值0原创 2022-10-19 12:46:02 · 1989 阅读 · 0 评论 -
ElementUI组件Dialog弹窗再次打开表单清除上次表单的必填验证提示
ElementUI组件Dialog弹窗再次打开表单清除上次表单的必填验证提示原创 2022-10-12 16:33:13 · 998 阅读 · 0 评论 -
elementui的upload组件根据后端接口上传文件到服务器失败,需要传参(header头部传参和params传参)
elementui的upload组件根据后端接口上传文件到服务器失败,需要传参(header头部传参和params传参)原创 2022-10-10 09:47:26 · 1709 阅读 · 0 评论 -
在vue下input标签根据输入字符动态自适应宽度的实现
实现在vue下input标签根据输入字符动态自适应宽度原创 2022-09-08 09:20:19 · 3241 阅读 · 2 评论 -
对elementui中一个el-form-item中包含多个输入框或下拉框等的表单验证处理问题
对elementui中一个el-form-item中包含多个输入框或下拉框等的表单验证处理问题原创 2022-09-07 17:56:03 · 5643 阅读 · 2 评论 -
elementui清除表单个别表单项验证
elementui清除表单个别表单项验证原创 2022-09-07 17:34:25 · 3766 阅读 · 0 评论 -
vue+elementui表格组件实现某一列数据部分可点击跳转,部分不可以
vue+elementui表格组件实现某一列数据部分可点击跳转,部分不可以原创 2022-08-09 18:41:44 · 1323 阅读 · 0 评论 -
vue的render函数入门
vue的render函数入门原创 2022-07-28 15:25:51 · 100 阅读 · 0 评论 -
vue的props对象可以用自定义函数validator限制传参的值
vue的props对象可以用自定义函数validator限制传参的值props{{type==-1;}}}平常没怎么用,自动忽略了。挺有用的还是。原创 2022-07-28 09:17:29 · 639 阅读 · 0 评论 -
elementui el-radio组件绑定字符串,传参和默认回显
如果需要传的是数字1,2,3之类的,官网的例子就可以满足的。elementui el-radio组件绑定字符串,传参和默认回显原创 2022-07-26 11:34:37 · 1635 阅读 · 0 评论 -
vue-element-admin路由与权限前端代码解读
路由处理逻辑图如下:中后台路由常见的常见如下:第一步,main.js 中加载了全局路由守卫第二步,permission.js 定义了全局路由守卫动态路由分析动态路由流程图动态路由生成逻辑如下图:在登陆页面,用户名和密码正确的情况下,hastoken是为true的,但是to.path的路径是"/",所以走的是else路径,先获取角色,再根据角色生成动态路由,然后再走一遍这个流程,不过这次走的是 if (hasRoles) 。也可以看出来是我们猜想的这样。动态路由主要的就是为了侧边栏(自我觉得原创 2022-07-13 16:14:11 · 464 阅读 · 0 评论 -
vue draggable学习
2.常用例子在此之前,这段代码要看懂的,myArr是个json数组demo:demo:demo:这里拖拽到下面的数据显示之所以不正常,貌似是拖拽的两个数据结构和字段名要一致,不然虽然可以拖拽成功,但是显示会有问题的意思就是说正确设置了group属性后就可以实现多列拖拽了这样两个可以互相拖拽了的3.1.1.3 自定义函数用法3.2 delay响应时间3.3 disabled启用禁用注意的是这里开启禁用的是全局的拖拽效果,不是个别的demo:没有animation的效果:有ani原创 2022-06-28 15:02:47 · 2652 阅读 · 0 评论 -
vue 同一页面路由参数改变刷新当前页面
vue 同一页面路由参数改变刷新当前页面1.场景2.实现1.场景当你路由传参进入一个页面,例如商品详情页,goodDetail?id=1,但是你还是在当前页面业务需要交id改为2时,你会发现页面没有主动进行刷新重新加载。2.实现watch:{ $route: { handler(newVal, oldVal) { //判断newVal有没有值监听路由变化 if (newVal != oldVal) { location.relo原创 2022-05-31 14:40:07 · 855 阅读 · 8 评论 -
js json扁平数组转树形结构
js json扁平数组转树形结构1.场景2.方法1.场景后台返回的数据是这样的渲染到页面也就成这样了很明显是不对的,结果应该是这样2.方法 const result = [] //定义空数组作为结果 const map = demo.reduce((pre, cur) => { pre[cur.zzlx] = cur.zzlx //将原始数组转换成对象 (用于判断是否有children属性) return pre原创 2022-05-27 16:31:24 · 193 阅读 · 0 评论 -
elementui table组件和popover实现表格列内容过长,显示隐藏多余字段,hover显示所有内容;无内容或则内容少则不显示popover
elementui table组件和popover实现表格列内容过长,显示隐藏多余字段,hover显示所有内容原创 2022-05-26 17:20:07 · 1065 阅读 · 0 评论 -
若依框架更改浏览器的title和图标
1.实现效果可以看到title是改变了的,图标偷懒就没有换2.实现过程改变图标打开index.html文件,第一个就是自己换一下图标就可以了的改变title还是在上面的index.html中,但是这里改变title标签里面的<%= webpackConfig.name %>是没有效果的。我们需要在其他地方改,如果你是在dev环境,就在.env.development文件下改,不然就在.env.production里面改,打开文件把页面标题改成自己想要的标题就可以了的。其原创 2022-04-14 10:48:35 · 12776 阅读 · 12 评论 -
elementui table组件多选获取选中行的数据
1.实用场景我需要对表格中的多行数据进行一次集体操作,比如发短信,怎么拿到选中的数据呢2.代码实现 <el-table :data="tableData" ref="registTable" > <el-table-column type="selection" min-width="2%"> </el-table-column> </el-table>原创 2022-04-13 11:50:57 · 10291 阅读 · 10 评论 -
elementui table组件合并行
elementui table组件合并行1.需求和效果今天遇到了个动态获取表格数据后还要对行进行合并,拿到的数据大致是这样的 tableData: [ { id: "1", name: "王小虎", amount1: "234" }, { id: "1", name: "王小虎", amount1: "165"原创 2022-04-08 15:15:03 · 900 阅读 · 0 评论 -
elementui Transfer组件 模板
1.效果2.代码实现 <div class="transfer"> <!-- 穿梭框 --> <div style="text-align: center"> <el-transfer style="text-align: left; display: inline-block" v-model原创 2022-03-30 15:02:40 · 1814 阅读 · 0 评论 -
vue 计量属性computed传参
1.需求开发项目时,遇到一个这种需求后端传回的是number类型的数据,为0时就显示无,其他的显示预约(剩余XXX),方法肯定也是可以的,但这种个人喜欢用计量属性2.代码实现{{ showRemain(i.remain) }}//js computed: { showRemain() { return function (val) { if (val == 0) { return "无"; } else {原创 2022-03-25 10:55:40 · 1293 阅读 · 0 评论 -
vue中引入外部css文件
1.全局引入如果你要全局引入css文件(比如框架css),需要在main.js中引入 import '@/assets/styles/ruoyi.scss' // ruoyi css跟上自己的css文件目录就行2.局部引入有时你只想在单个页面引入css文件<style scoped>@import '../assets/iconfont/iconfont.css';这个分号一定要写,要不会报错</style>...原创 2022-03-21 09:43:47 · 1684 阅读 · 0 评论 -
elementui input校验可以为0.5的整数倍(包括0)
1.需求2.实现<el-form-item label="有效天数" prop="validDay"> <el-input v-model="addRuleform.validDay" style="width: 300px" ></el-input> </el-form-item> //表单校验规则原创 2022-03-18 17:16:56 · 957 阅读 · 0 评论 -
使用vscode快速建立vue模板
使用vscode快速建立vue模板1.目的2.实现1.目的使用vsCode开发vue的时候,你肯定不希望一创建一个vue文件,你就要从零开始写vue的模板,js(watch,data),css;现在想实现下面这种效果可以不?当然是可以的2.实现1.打开VSCODE编辑器,左上角选项中依次选择“文件 -> 首选项 -> 用户代码片段”,此时,会弹出一个搜索框,我们输入vue,会出现 如下:会自动打开vue.json文件,把下面内容复制 "Print to console":原创 2022-03-15 10:09:11 · 1169 阅读 · 0 评论 -
浏览器调试vue
浏览器调试vue1.场景2.方法1.场景我的vue项目需要在浏览器调试(只会这个),但是默认的可能不行2.方法在自己的项目vue.config.js文件下的configureWebpack属性下加入devtool: ‘source-map’, configureWebpack: { devtool: 'source-map', },重启项目,就可以调试了...原创 2022-03-09 14:48:17 · 1203 阅读 · 2 评论 -
vue过滤器调用外部的方法(全局过滤器)
vue过滤器调用外部的方法1.问题2.解决1.问题做项目的时候,很多表格都会用到备注之类的内容,太长了不想换行只能显示部分,所以肯定是要用filter过滤器。因为很多页面都要用到,所以单独抽离为过滤器。2.解决首先,自己在一个js文件下写上过滤器方法然后在main.js中挂载最后在自己的项目要用的地方引用最后才发现是全局filter的使用,平时用的少。记录下...原创 2022-03-03 21:26:54 · 740 阅读 · 0 评论 -
elementui Pagination 分页组件模板
elementui Pagination 分页组件模板1.效果2.代码实现1.效果2.代码实现 <!-- 分页 --> <div class="block"> <el-pagination :background="true" background-color=" #0064cb" @size-change="handleSizeChange" @current原创 2022-03-01 17:24:51 · 349 阅读 · 0 评论 -
Vue ElementUi纯table组件实现购物车全选,结算
Vue ElementUi纯table组件实现购物车结算1.最终效果二级目录三级目录1.最终效果quaa二级目录三级目录原创 2022-02-23 17:12:57 · 3699 阅读 · 2 评论