这类问题一般会在同一个弹框里面用v-if和v-else判断显示那个表单出现的问题:
1.遇到打开页面新增弹框就出现了校验是否非必填项的情况?
比如这种情况:
我们可以在弹框关闭和打开弹框的时候设置一下重置表单或者清空验证。但是要注意在打开弹框的时候要使用nextTick,不然在dom没有加载渲染完,重置表单会报错
openDialog(){
this.openDialog = true; // 打开弹框,要注意重置表单要写在打开弹框的后面,不然不起作用.
this.$nextTick(() => {
//重置表单,可以清除验证
this.$refs.formData.$children[0].resetFields()
//清空表单的数据,这一点我也不知道为什么重置的时候没有清楚数据
this.formDataAdd = {} ;
})
}
//在关闭的时候设置一下,其实在打开的时候设置过,就不用在关闭的时候设置了,不过我想设置就设置了
close(){
this.$refs.form.$children[0].resetFields()
this.$refs.form.$children[0].clearValidate()
}
在遇到这类问题的时候主要的解决方法用到的就是下面的这两个函数,看你如何搭配使用:
this.$refs.form.$children[0].resetFields()
this.$refs.form.$children[0].clearValidate()