记录一个v-if与自定义指令的BUG

在做某个系统的时候因为element自带的v-inputv-input-number不能满足所需要的功能,例如限制小数位数,最大值最小值和值是否允许存在非0之类的状态,写了一个自定义指令v-onlyNumber来满足需求(v-onlyNumber在我其他文章内有直接copy就行),结果在碰到v-if的时候发现存在某种情况会导致当在v-if内的的标签挂载上指令,关闭v-if之后,会导致挂载对象发生错误的问题

在Vue的自定义指令内有一句

自定义指令其实不推荐在组件上使用,我使用指令的node是整个列表最后一个,当v-if关闭之后会找同样的v-input挂载上去

解决办法就是换掉v-if使用v-show

或者使用v-form自带的rules对付一下

但rules不是很方便写小数限制,这就看项目需求和时间成本了

相关推荐
狂炫冰美式14 小时前
《预言市场进化论:从罗马斗兽场,到 Polymarket 的 K 线图》
前端·后端
码力巨能编14 小时前
Markdown 作为 Vue 组件导入
前端·javascript·vue.js
私人珍藏库14 小时前
[吾爱大神原创工具] FlowMouse - 心流鼠标手势 v1.0【Chrome浏览器插件】
前端·chrome·计算机外设
旧梦吟15 小时前
脚本网页 地球演化
前端·算法·css3·html5·pygame
xiaoxue..15 小时前
哨兵节点与快慢指针解决链表算法难题
前端·javascript·数据结构·算法·链表
这是个栗子15 小时前
【前端知识点总结】前端跨域问题
前端·跨域·cors
尽欢i15 小时前
踩过坑才懂:前端生成唯一 ID,别用 Date.now ()了!一行代码搞定
前端·javascript
JS_GGbond15 小时前
解锁 JavaScript 对象的“魔法宝箱”:这些方法让你玩转对象操作
前端·javascript
是杉杉吖~15 小时前
《5 分钟上手 React Flex 容器:从 0 搭建响应式卡片列表》
前端·react.js·前端框架
仰望.15 小时前
vue 甘特图 vxe-gantt table 拖拽任务调整开始日期和结束日期的使用,拖拽任务调整日期
vue.js·甘特图·vxe-ui