vue-quill-editor的失焦事件
vue-quill-editor
的用法再此就不再赘述了,只记录我在使用过程中踩的坑。
版本:Vue2
vue-quill-editor3.0.6
封装组件:
<vue-quill-editorclass="editor":class="dynamicClasses"ref="myTextEditor"v-model="value":disabled="disabled":options="editorOption"@blur="onEditorBlur"@focus="onEditorFocus"@ready="onEditorReady"@change="onEditorChange"/>
🙋问题就在于blur
事件在该触发的时候没触发,在没聚焦的时候乱触发。
解决方案:手动监听失焦事件
this.$nextTick(() => {const quill = this.$refs.myTextEditor.quill;quill.root.setAttribute('tabindex', '0'); // 设置 tabIndex 以支持键盘焦点和 blur 事件quill.root.addEventListener('blur', this.onEditorBlur);});