在Vue项目中集成富文本编辑器

先用vue可视化图形界面创建一个vue项目

安装依赖：

npm install mavon-editor --save

在main.js当中输入代码：

import mavonEditor from 'mavon-editor'
import 'mavon-editor/dist/css/index.css'
// use
Vue.use(mavonEditor)

新建一个Test.vue：

<template>
	<div id="main">
		<mavon-editor v-model="value" />
	</div>

</template>


<script>
	export default{
		data(){
			return {
				value: '',
			}
		}
	}
</script>

在路由文件中routes加入：

 {
    path: '/test',
    name: 'test',
    component: Test
  }

效果图：