100字范文,内容丰富有趣,生活中的好帮手!
100字范文 > vue 表单验证 表格刷新问题

vue 表单验证 表格刷新问题

时间:2020-10-09 15:33:18

相关推荐

vue 表单验证 表格刷新问题

1.表格数据更新,页面不更新处理:

(1)this.$set(row, row.children, (row.children = row.children));

(注意:上面是改变了children,实际情况改变的哪个属性,就写啥)

(2)this.tableData = JSON.parse(JSON.stringify(this.tableData));

2.表单验证以及刷新问题

(1).this.$refs.ruleForm.resetFields(); // 重置关闭所有校验 会清除填写内容(一般在退出当前页面或者是才加载页面时使用)

(2)this.$refs.ruleForm.validateField("barCode");单独校验barCode,this.rules.barCode= [{ required: true, message: '请上传图片' }]

(推荐:)或者在表单项<el-form-item label="评价颗粒度:" prop="keLiDuValue" size="small">写prop属性,表单rules配置 <el-form :model="ruleForm" :rules="rules" label-width="220px" ref="ruleForm">

rules: {

keLiDuValue: [

{ required: true, message: "请选择评价颗粒度", trigger: "change" }

],}

(3)this.$refs.ruleForm.clearValidate('barCode');//强制取消barCode这一项的校验

触发对整个表单的校验: this.$refs.queryForm.validate();

(4)注意:表单校验还不生效时,可以配置:error属性,手动触发,<el-form-item :error="punishSubjectError">

data中自行定义errorMsg: {},

if (this.ruleForm.subjectLinkList.length == 0) {

this.errorMsg = { punishSubjectError: "请添加处罚主体。" };

return;

}

最后注意:当表单一进入页面就发生校验时:检查prop属性配置值是否与rules中一致,特别是检查为select中v-model的初始值(null或undefine或者空字符串啥的)是否与接口获取的值为空时对其赋值一致,这种情况常常是接口数据为空,给其从新赋值与初始值不一致造成的。

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。