Vue ElementUI 之在項目頁面中插入富文本編輯器

1、安裝依賴 vue-quill-editor

安裝方式有多種，可視化安裝、npm 安裝，或者也可以 CDN 引用，詳見 GitHub上的說明
（1）可視化安裝
在項目下，依賴> 安裝依賴> 運行依賴，搜索並安裝 vue-quill-editor

（2）npm 安裝

npm install vue-quill-editor --save

2、全局註冊 vue-quill-editor

在項目的 main.js 中導入vue-quill-editor

// 引入富文本編輯器
import VueQuillEditor from 'vue-quill-editor'
// require styles 富文本編輯器對應的樣式
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'

// 註冊富文本編輯器組件爲全局組件
Vue.use(VueQuillEditor)

3、vue-quill-editor 使用方法

根據自己的項目，選擇使用方法，本文選擇SPA

SSR：服務器端渲染
SPA：客戶端渲染

在自己自定義的 vue 組件使用富文本編輯器，通過 v-model 綁定數據對象

<quill-editor v-model="addForm.goods_introduce"></quill-editor>