随笔分类 -  vue

el-select组件改造成多选显示多个标签加数字标签的形式
摘要：接到需求需要只在一行内显示多个标签，且标签超出输入框时超出的标签不显示，只显示统计数字的标签。 效果图： 网上查资料，发现一篇大佬的文章跟该需求很类似，就借用了大佬的写法，文章链接看这里。 后面发现还是有两个地方需要做下微调整。 1、需要数字标签紧跟着文字标签的后面排列，不能一直固定在右边 2、当页 阅读全文
posted @ 2023-01-13 11:41 applesky 阅读(3247) 评论(0) 推荐(0)
vue el-date-picker多选日期时间时，支持时间排序
摘要：需求背景： 当el-date-picker可以多选日期时，时间的顺序是按照选择的顺序来的，体验不是很好。需要在选时间的同时进行时间排序 解决方案： 使用watch监听v-model绑定的值的变化，然后进行时间排序 代码示例： html <el-date-picker type="dates" v-m 阅读全文
posted @ 2023-01-11 16:58 applesky 阅读(953) 评论(0) 推荐(0)
解决el-date-picker组件当日历面板展开时点击清空图标无法清空问题
摘要：问题现象： 支持选择多个时间的日期组件，在日历面板展开时点击清空图标是无法清空的 解决方案： 查找资料发现可以通过change事件来监听清空操作，当监听到value值为null时，说明在做清空操作，这时就能通过直接将绑定的数据值清空来达到清空的效果，不过直接进行数据赋值为空时，页面仍然会显示数据，后 阅读全文
posted @ 2023-01-10 16:54 applesky 阅读(3506) 评论(0) 推荐(0)
el-select多选框在表单重置后，出现空tag问题
摘要：现象： 原因： 下拉框多选时，数据类型是数组，设置的数据初始化值不是空数组，而是空字符串导致 修改： 阅读全文
posted @ 2022-05-27 19:01 applesky 阅读(655) 评论(0) 推荐(0)
解决Cannot find module '@vue/babel-preset-app'
摘要：问题现象： 解决方法： npm install '@vue/babel-preset-app' --save-dev 注： 也可以输入 npm install @vue/babel-preset-app --save-dev ， 如果报‘源文本中存在无法识别的标记’ 则需要打单引号或者双引号 阅读全文
posted @ 2022-05-01 11:31 applesky 阅读(7644) 评论(0) 推荐(0)
vue项目启动时报错./node_modules/cache-loader/dist/cjs.js??ref--12-0
摘要：问题现象： 问题原因： vue文件里的引入的组件的文件路径不对，导致了报错 解决办法： 配置正确组件引入路径 阅读全文
posted @ 2022-05-01 11:23 applesky 阅读(10990) 评论(0) 推荐(0)