假设你已经知道如何引入vue-quill-editor,并且遇到了跟我一样的问题(如上图),显示出来的图标排列不整齐,字体,文字大小选择时超出边框。你可以试试下面这种解决办法 。
- 在使用文本编辑器的vue页面中引入vue-quill-editor中的样式。
@import "../../node_modules/quill/dist/quill.snow.css";
- 然后在组件中添加class名 —— class=“ql-editor”。
你就会看到错乱的图标样式已经改变,如下图:<quill-editor class="ql-editor"></quill-editor>
- 如果在包裹组件的标签上添加class名 —— class=“ql-container ql-snow”。
你将会看到下图的效果,文本编辑器外面多了一层容器。<el-form-item class="ql-container ql-snow"> <quill-editor class="ql-editor"></quill-editor> </el-form-item>