在网上看到了他人的解决方案,发现他们的方案是不对的,他们只是单单解决了验证错误,却没有解决验证正确的情况下。
1.首先,我们得知道,使用validateField部分校验数组的时候,数组有几位,就会回调几次。当也就是空的时候,表示验证通过,回调返回为“ ”,所以就是,你校验几个规则,就会返回几个结果,如果通过就为“”(空)。
2.我们只需要定义一个数组
const validateFieldList= []
3.每当校验,就像数组中push该message值
validateFieldList.push(errorMsg)
4.然后我们需要判断每个item是否为空,且该数组的长度是否等于你要校验值的个数。
if ( validateFieldList.length == 2 &&validateFieldList.every((item) => item === ""))
//这里的2为你要校验值的个数
//网上的其他方法错就错在这里,他们没有校验数组长度,从而第一次validateFieldList的每一项item就等于“”,从而并没有起到该有的效果。
5.最后贴上完整:
//这是登录按钮事件
submitLoginForm(formName) {
console.log("点击了登录")
let validateFieldList= []
this.$refs[formName].validateField(
["email", "password"],
async (errorMsg) => {
if (!errorMsg) {
validateFieldList.push(errorMsg)
if (validateFieldList.length == 2 && validateFieldList.every((item) => item === "")
) {
// 之后的操作
}
} else {
console.log("error submit!!")
return false
}
}
)
},