错误效果
错误描述
在切换radio切换的时候校验提示提示出来了，本身不应该出来但是如何取消呢？因为在切换时候我们置空但是并没有取消校验，所以从通过到拒绝置空时候肯定会出现提示语，那么我们把提示校验的方法去掉就行了。
错误代码
reviewStateChange(val) {
if (val === '2') {
this.ruleForm.remark = ''
}
if (val === '3') {
this.ruleForm.remark = ''
}
}正确代码
reviewStateChange(val) {
if (val === '2') {
this.ruleForm.remark = ''
}
if (val === '3') {
this.ruleForm.remark = ''
// this.$nextTick(() => {
// this.$refs.ruleForm.resetFields()
// })
this.$nextTick(() => {
this.$refs.ruleForm.clearValidate() // 只清除清除验证
})
}
}文章来源地址https://www.toymoban.com/news/detail-765934.html
总结方法
①清除表单内容和清除表单验证消息
this.$nextTick(()=>{
this.$refs.form.resetFields();
})
②只清除表单验证消息、不清楚表单内容
this.$nextTick(()=>{
this.$refs['form'].clearValidate() // 只清除清除验证
})
正确样式
场景延申
我们在页面切换的时候使用同一个Form组件，我们就需要把校验的结果给去掉，虽然不影响功能，但是页面显示给人感觉不太好。文章来源：https://www.toymoban.com/news/detail-765934.html
到了这里，关于el-form组件如何清除校验提示（前端技能提升）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
