@[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 绑定值必须一样