//工具欄配置
const *******options=[
["bold","italic","underline","strike"],//加粗 斜體 下劃線 刪除線
["blockquote","code-block"],//引用 **塊
[, ],//1、2 級標題
[, ],//有序、無序列表
[, ],//上標/下標
[, ],//縮排
//, // 文字方向
,//字型大小
,//標題
[, ],//字型顏色、字型背景顏色
,//字型種類
,//對齊方式
["clean"],//清除文字格式
import from"vue-quill-editor";
import"quill/dist/quill.core.css";
import"quill/dist/quill.snow.css";
import"quill/dist/quill.bubble.css";
exportdefault,/*大小*/maxsize: else,//link: function(value) else //有的伺服器要求請求頭需要有token
methods: ,//富文字上傳前
beforeupload() else//loading動畫消失
this.quillupdateimg= false;
},//富文字上傳失敗
uploaderror() .ql-snow .ql-tooltip.ql-editing a.ql-action::after.ql-snow .ql-picker.ql-size .ql-picker-label::before,
.ql-snow .ql-picker.ql-size .ql-picker-item::before.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=small]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=small]::before.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=large]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=large]::before.ql-snow .ql-picker.ql-size .ql-picker-label[data-value=huge]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value=huge]::before.ql-snow .ql-picker.ql-header .ql-picker-label::before,
.ql-snow .ql-picker.ql-header .ql-picker-item::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before.ql-snow .ql-picker.ql-font .ql-picker-label::before,
.ql-snow .ql-picker.ql-font .ql-picker-item::before.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=serif]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=serif]::before.ql-snow .ql-picker.ql-font .ql-picker-label[data-value=monospace]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value=monospace]::before{content:'等寬字型';
引入：components: {
editor
data() {return{
article: {
content:'',
vue獲取編輯器純文字 Vue使用富文字編輯器
一.選取編輯器 剛開始使用的是kindeditor，在npm社群中找到了適用於vue的版本vue kindeditor。存在如下缺陷 文件不全 網上資料不全 npm社群例項過於簡單 上傳不能控制尺寸。二 例項 前端vue html js import axios from axios import ...
vue的富文字編輯器
在 vue 專案中引入 tinymce 富文字編輯器 專案中原本使用的富文字編輯器是 wangeditor，這是乙個很輕量 簡潔編輯器 bootstrap wysiwyg 微型，易用，小而美，只是 bootstrap jquery kindeditor 功能強大，簡潔，需要配置後台，而且好久沒見更新...
vue 使用 富文字編輯器
1安裝依賴 npm i quill s npm i vue quill editor s 2.上 元件 如下 template edit container 編輯器 content ref myquilleditor options editoroption blur oneditorblur ev...