element-ui设置下拉框切换联动表单的必填和非必填，表单联想搜索功能实现

➢ 需求

image.png

1、节点类型下拉选择的时候
选择1，唯一识别码为必填，需要校验和显示*
选择其他的，唯一识别码不做校验，隐藏*
2、输入标准名称，标准名称联想搜索

上代码

核心点

• 在唯一识别码的form-item上，添加required属性绑定isHaveTo参数
  computed计算isHaveTo，根据节点类型下拉框选择的值来决定是为true还是false

 isHaveTo() {
        return this.ruleForm.code == '1';
    }

• 在节点类型的校验函数中 ，判断当节点类型不为1的时候，移除对唯一识别码的校验

这步很重要，如果前面节点类型选择1，点击了确定按钮，触发了表单校验，当节点类型又改变了，不移除对唯一识别码的校验结果的话，唯一识别码只是会不显示*号，但是唯一识别码的红色提示还在

出现这种错误情况

image.png

移除校验结果后就没得问题了

 var validatePass2 = (rule, value, callback) => {
        if (value === '') {
          callback(new Error('请选择节点类型'));
        } else {
            if(this.ruleForm.code != '1'){  // 移除校验结果  
                this.$refs.ruleForm.clearValidate('serverUrl');
            }
          callback();
        }
      };

完整代码 直接用~~~~ （欧里给！！）

最终效果
节点类型选择1的状态

image.png

选择1，并点击提交触发校验的状态

image.png

再把节点类型切换到其他的

image.png