Vue添加富文本编辑器

1 安装 vue2-editor

npm install vue2-editor

如报以下错误则需要以管理身份运行cmd窗口，且要切换到项目文件目录内才能运行 npm命令

Error: EPERM: operation not permitted, open 'C:\Program Files\nodejs\npm_cache\_cacache\tmp\1a0eb15e'

2 引入方式

1 全局引入

1.引入

import Vue from 'vue'
import Vue2Editor from "vue2-editor"

2.注册

Vue.use(Vue2Editor);

2 局部引入

1.引入

import {
    
     VueEditor } from "vue2-editor"

2.注册

	components:{
    
    
				VueEditor
		},

3 回显数据方式方式

富文本框存入数据库的数据是html标签所以回显数据时需要放入v-html="scope.row.description"标签内解析

	<el-table-column type="expand">
					<template v-slot="scope">
						<div v-html="scope.row.description"></div>
					</template>
				</el-table-column>