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或者空字符串啥的)是否与接口获取的值为空时对其赋值一致,这种情况常常是接口数据为空,给其从新赋值与初始值不一致造成的。