总的来说,引起这种问题的原因是vue无法监听到对象中的数组的改变,所以解决策略是:
1.在cascader的change事件中去强制更新form表单绑定的对象
2.自定义校验规则,去校验表单对象的参数而不是传过来的参数
var checkOrg = (rule, value, callback) => {
if (!this.ruleForm.selectOrg) {
return callback(new Error("请设置上级机构"));
} else {
callback();
}
};
selectOrg: [
{ required: true,validator: checkOrg,message: "请设置上级机构",trigger: "change" }
],
orgChange(e) {
this.ruleForm = Object.assign({ test: 1 }, this.ruleForm);
this.ruleForm.selectOrg = e;
this.ruleForm.orgId = e[e.length - 1];
this.ruleForm.organizationId = e[e.length - 1];
},