富文本编辑器是一种内嵌于浏览器，所见即所得的文本编辑器。目前网站上比较常见的富文本编辑器有：TinyMCE、UEeditor、kindeditor、wangEditor 等等许多，本文使用的是 wangEditor，轻量级，小巧实用，配置方便，使用简单。可以自定义皮肤功能，免费开源。
本文目的
实现富文本编辑器发布文章功能。
wangEditor 使用说明
wangEditor 的使用方式可以参见官方文档：www.wangeditor.com/v4/。
技术实现方式
主要核心就是存储富文本编辑器输出的内容，并在页面中进行内容的回显。
法一
富文本编辑器输出的内容在不做任何处理的情况下，就是 dom 结构也就是 html，如下：
- 直接把这段 html 字符串传给后端存储
- 前端使用 vue 的指令 v-html 进行 html 字符串内容的展示
优点：在 vue 项目中实现简单方便
法二
前端把编辑器输出的内容拼成 html 页面：
let htmlValue = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>news</title>
<style>
</style>
</head>
<body>
<div>
<div>${编辑器输出的内容}</div>
</div>
</body>
</html>
`
再把此页面生成 .html 格式的文件，然后上传到服务器，在服务器里面读取并保存。
缺点：
- 前端需要通过 iframe 标签把服务器上的 html 文件嵌套进来
- 把 html 文件上传到服务器会比较慢
法三
- 前端直接提交编辑器输出的 html 内容
- 服务器读取后创建一个 .html 的文件并把读取到的内容写入并保存在服务器里面。
