ElementUI表单校验trigger设为change无效问题

简介: ElementUI表单校验trigger设为change无效问题

如果封装的自定义表单组件,内部存在el-form,所有的表单元素都在form内部,然后当整个form的数据变化时,this.$emit('input', value),这种情况不会触发表单的校验的,因为当前组件作为一个整体,被嵌入在el-form-item中,它并不知道你的数据变化了


以el-input为例,在源码中可以看到,在watch中监听value变化,并通知上层数据变了


watch: {
  value(val) {
    this.$nextTick(this.resizeTextarea);
    if (this.validateEvent) {
      this.dispatch('ElFormItem', 'el.form.change', [val]);
    }
  },
}


解决方案:

this.$emit('input',value);
//添加下面这句
this.$parent.$emit('el.form.change');
相关文章
|
前端开发 API
解决el-table中横向滚动条无法显示的问题
解决el-table中横向滚动条无法显示的问题
4333 0
|
5月前
|
前端开发 开发者 容器
如何解决 flex 布局下子元素 width 宽度设置失效的问题
本文通过实际案例,探讨前端开发中flex布局导致子元素宽度设置失效的问题,分析原因并提供两种解决方案:去除flex布局(不推荐)和设置min-width(推荐),帮助开发者深入理解flex特性,提升布局控制能力。
350 0
如何解决 flex 布局下子元素 width 宽度设置失效的问题
|
存储 开发工具 git
Vscode 拉取代码时出现 在签出前 请先清理仓库工作树
Vscode 拉取代码时出现 在签出前 请先清理仓库工作树
3790 0
|
11月前
|
存储 JavaScript 前端开发
务必把握Map对象在JavaScript循环中的使用细节
由于Map对象跟传统的对象类似,但提供了更多的迭代功能,它被广泛用来代替Object存储键值对。适当的使用Map和配套的迭代方法,可以让代码更加清晰,提高数据操作的灵活性和效率。在数据量大或者对迭代顺序有特定需求时,Map会是一个很好的选择。
629 0
|
9月前
|
JavaScript 前端开发
js小数运算出现的问题(精度丢失)及解决办法-亲测有效
JavaScript浮点数运算存在精度丢失问题,如0.1+0.2不等于0.3。原因是十进制小数转二进制时可能出现无限循环,导致舍入误差。本文提供一种精度处理方法,通过将小数转为整数运算后再还原,实现加减乘除的精确计算,解决常见浮点运算误差问题。
1371 0
|
编解码 数据可视化 前端开发
可视化大屏适配scale方案
本文介绍了一种使用CSS实现可视化大屏适配的方案。通过设置容器的`transform: scale()`属性,根据屏幕大小动态调整大屏内容的缩放比例,从而实现不同分辨率下的适配。文章提供了详细的实现方法,包括Vue组件的模板、逻辑和样式代码,并展示了实际效果的对比图。此外,还推荐了一个npm包`autofit.js`,用于简化大屏适配的实现。
939 1
可视化大屏适配scale方案
|
UED
使echarts图例legend只选中一个(selectedMode)
本文介绍了如何在ECharts图表中设置图例(legend)的选中模式为单选('single'),以确保在有多个图例时,用户只能选择一个图例项进行展示,从而提升图表的可读性和用户体验。
1771 2
使echarts图例legend只选中一个(selectedMode)
|
JavaScript 开发者
vue解决报错Unable to preventDefault inside passive event listener invocation.
vue解决报错Unable to preventDefault inside passive event listener invocation.
2697 0
|
UED
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
Element UI 一键校验多表单(v-for循环表单,异步校验规则,v-for 中的 ref 属性,避坑 forEach 不支持异步 await )
498 0
|
JavaScript 前端开发
JavaScript 数字精度丢失问题
【10月更文挑战第24天】解决 JavaScript 数字精度丢失的问题需要综合考虑多种因素,并根据具体情况选择合适的方法。通过合理的处理和预防,可以在一定程度上减少精度误差的影响,确保计算结果的准确性。

热门文章

最新文章