移除表单校验
<Form ref="form" rule={this.rules}>
<FormItem prop="name" label="姓名">
<Input/>
</FormItem>
<FormItem prop="age" label="年龄">
<Input/>
</FormItem>
</Form>
// 根据判断条件, 移除所有表单项的校验
if (/*条件*/) {
this.$refs['form'].clearValidate();
}
// 但是有时候只需要移除其中的某一项校验, 如只移除姓名的校验:
if (/*条件*/) {
this.$refs['form'].clearValidate(['name']);//prop="name",ref="form"(表单名称)
}
// 多个删除时,把要移除校验的表单项的多个prop放到数组里面,
//调用clearValidate()方法时传入prop数组参数['name','email']
// 不传任何参数时, 默认会移除整个表单校验
添加单个校验
this.$refs.ruleForm.validateField("title");//校验单个属性
this.$refs.ruleForm.validateField('title', (error) => {//点击时校验并且判断是否通过
if(!error){
//当校验通过时,这里面写逻辑代码
alert("d")
}
})
自定义提示信息

一,这种控制台会报错的
1,用下标的
this.$refs.ruleForm.fields[0].error="错误提示"//fields是固定的,下标表示是第几个输入框(带prop的)
2,用prop名称的
this.$refs.ruleForm.fields.find((item) => (item.prop === 'file')).error='asdasd'
//(item.prop === 'file')file就是表单里的prop="file"
//这个F12会报错,但不影响
//报错原因prop是单向绑定,不能更改数据,只能由父组件传输过来
二,还有一种方法就是在data里定义一个变量(这种不会报错)
data() {
return {
error:''//这里默认一定要设置为空
}
点击的时候
this.error=''//注意:这里想要提示必须每次在提示前给他赋空值,要不会只会执行一次提示
this.error='错误提示'
如果想要消除这个报错信息,直接给赋空值就行
this.error=''
版权声明:本文为weixin_43826491原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。