关于vue.js:Vue使用vuequilleditor实现富文本需求

Quill 富文本编辑器
简略记录

一，组件中引入
import {quillEditor} from ‘vue-quill-editor’
款式文件引入
import ‘quill/dist/quill.core.css’
import ‘quill/dist/quill.snow.css’

将 quillEditor 注册为组件，并写出标签

<quill-editor
      class="editor"
      @ready="onEditorReady($event)"
      @change="onEditorChange($event)"
      :value="content"
      :options="editorOption"
    />

editorOption: {
// 此处设置 quill 的一些属性和其模块属性
        placeholder: '占位占位占位',
        modules: {
          toolbar: {
            container: toolbarOptions,
            theme: 'snow'
            handlers: {
            // 此处定义 toolbar 上按钮的行为
              'image': (value) => {// 用户点击了 toolbar 的图片按钮之后的行为},
              'link': (value) => {// 用户点击了 toolbar 的 link 按钮之后的行为}
            }
          }
        }
}

onEditorReady (quill) {this.quill = quill}
onEditorChange ({quill, html, text}) {// 解决富文本内容}