vue使用富文本编辑器

1.导入

npm install vue-quill-editor --save

vue-quill-editor的npm官网链接：点我跳转

2.页面使用

2.1html部分

 <el-card>
		<quill-editor v-model="formSubmit.detail" ref="myQuillEditor" style="height: 500px;" :options="editorOption">
		 </quill-editor>
</el-card>

2.2js部分

import {
    quillEditor
  } from 'vue-quill-editor'
  import 'quill/dist/quill.core.css'
  import 'quill/dist/quill.snow.css'
  import 'quill/dist/quill.bubble.css'

定义接收富文本编辑器的变量与v-model对应

 formSubmit:{
          detail:'',
        },

3.显示富文本编辑器内容

主要使用的是v-html属性

   <p v-html="form.detail"></p>

v-html后面跟的是要显示的内容