vue-element-admin的TinymceEditor富文本编辑器

眼熟吗家人们

vue-element-admin【后台管理系统大部分都会用的一个框】

里面的富文本编辑器用起来说复杂不复杂说简单也还好。

1.引入

import TinymceEditor from '@/components/Tinymce'

2.单纯的使用

<TinymceEditor :height="500" v-model="content" :readonly="disabled"/>

import TinymceEditor from '@/components/Tinymce'
components: { TinymceEditor }

3.可以编辑和不可以编辑怎么去改造

a.打开这个组件

b.加上一个新prop参数：readonly【true：只读，false：可以编辑】

c.别忘了初始化

d.跟value一样，简单监听一下。

e.行了，有问题就慢慢找问题！

vue-element-admin自带的富文本编辑器是没有字号选择的！！

1-找到组件下面的这两个文件

2-index.vue需要修改的↓（字号自己定）

fontsize_formats: "8pt 10pt 12pt 14pt 18pt 24pt 36pt",

3-toolbar.js里面给toolbar加上这个↓

fontsizeselect