el-form中el-tree的rules校验

el-form中el-tree的rules校验

常规手段添加校验，如下：

organList: [
    { required: true, message: '请选择关联机构', trigger: 'change' }
]

如上图所示，无论是否选择el-tree，都会校验报错，所以这种方法不可行。

有效方法如下：

<el-form :rules="Rules">
    ...
    <el-form-item prop="organList">
        <el-tree
              ref="organTree"
               ...
        ></el-tree>
    </el-form-item>
    ...
</el-form>

data() {
    let validOrgan = (rule, value, callback) => {
        // 获取选中节点数组
        let arr = this.$refs.organTree.getCheckedKeys();
        if(!arr || arr.length === 0) {
            callback(new Error('请选择关联机构'))
        } else {
            callback();
        }
    }
    return {
        Rules: {
            organList: [
                { required: true, validator: validOrgan, trigger: 'change' }
            ]
        }
    }
}