之前在PC端项目中也用过富文本插件。当时用的是tinymce，是国外的插件，效果还不错。接下来的项目需求是在移动端使用富文本插件。百度了一下，找到了一个插件wangEditor，但是感觉在移动端效果不是很好。主角vue-quill-editor，其实这个插件也是基于国外的一款插件Quill，而且我还找到了vue-quill-editor插件作者的个人网站，非常很酷，里面有很多文章。地址附在文末。安装npminstallvue-quill-editor--save插件是依赖Quill的，但是不需要再去下载Quill，因为在安装vue-quill-editor的时候已经安装了Quill引入全局引用。在main.js中引入插件//引入插件核心文件importVueQuillEditorfrom'vue-quill-editor'//引入插件样式import'quill/dist/quill.core.css'import'quill/dist/quill.snow.css'import'quill/dist/quill.bubble.css'Vue.use(VueQuillEditor);使用此插件在组件中引入本地引用/quill.bubble.css'//注册子组件exportdefault{components:{quillEditor}}一开始看到全局引用和局部引用不一样，一个是直接导入，一个是加{}导入.后来在百度上找了其他文章，发现两个都有用，于是就去看了源码，所以这两个方法都可以。import_Quillfrom'quill'importquillEditorfrom'./editor.vue'constQuill=window.Quill||_Quillconstinstall=(Vue,globalOptions)=>{if(globalOptions){quillEditor.props.globalOptions.default=()=>globalOptions}Vue.component(quillEditor.name,quillEditor)}constVueQuillEditor={Quill,quillEditor,安装}exportdefaultVueQuillEditorexport{Quill,quillEditor,install}使用
