vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?

validateField是做什么的?


为什么会需要自触发的事件呢?


         如果用原生html封装组件 (vue-quill-editor富文本组件)会无法触发element ui的表单校验,需要点击提交按钮才能校验。rules里的trigger: 'blur’已经不起效了。

接下来我用代码的形式给大家呈现一下(富文本组件)

        富文本组件

vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?_第1张图片


自触发校验三部曲

1.获取表单元素(ref)

vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?_第2张图片

 2.添加事件(触发校验)

vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?_第3张图片

 3.添加校验规则实现调用

vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?_第4张图片

 在从事件函数中启动校验 

 

 

效果完成

vue中富文本编辑框 vue-quill-editor 如何触发表单校验?validateField是做什么的?_第5张图片

 

 

你可能感兴趣的:(vue,vue.js,html,html5,elementui)