iview自定义表单验证

@[TOC]

iview自定义表单验证

之前总结过iview简单表单验证：
https://blog.csdn.net/A_LL_IS_WELL/article/details/111227468https://blog.csdn.net/A_LL_IS_WELL/article/details/111227468
后来遇到一个问题，当选择新建时表单显示为input 当选择已存在时 提供选择框供选择，为了避免新建时输入的名称与已经存在的重复，需要在input添加校验。特此记录一下，怕自己以后忘了
自定义校验：

data中这样写

//这里时为了调用methods里的方法需要这样写
const self = this
const validateSystem = function(rule, value, callback) {
if (self.systemStatus === 0) {
self.checkSystem(value).then(res => {
if (res) {
callback(new Error(‘该系统已存在’))
} else {
callback()
}
})
}else {
callback()
}
}

这里一开始写的this发现调用不到methods中的方法，参考了这里的回答：https://segmentfault.com/q/1010000011080047
具体原因由于不是专业搞前端的还不太清楚

校验：

methods中的方法，主要是为了校验输入内容是否在下来列表中已经存在
注意事项：1.form表单需要绑定：rules = ruleValidate
2.prop 和v-model 绑定值必须一样