vue-html5-editor集成后有序列表无序列表功能问题

解析原因：

• 有序列表是基于<ol><li>这2个标签的，默认这2个标签是有样式的，可能因为网站全集样式对这2个标签的样式进行了改动，导致默认样式丢失，失去了排序号。
• 无序列表是基于<ul><li>这2个标签的，默认这2个标签是有样式的，可能因为网站全集样式对这2个标签的样式进行了改动，导致默认样式丢失，失去了实心小圆。
• 有序无须列表的默认样式的前置样式都在编辑框的前面，如果<ol>或者<ul>的margin-left不够或者不存在也有可能到置样式被遮挡显示不出来，其次文本框父级的padding-left不够或者不存在也有可能到置样式被遮挡显示不出来

解决方法：

在文本框和前端显示页面的父级元素加入自定义样式：如class='editor',并定义相关样式

.editor ol li {
	list-style: decimal;
	margin: 0 20px;
}
.editor ul li {
	list-style: disc;
	margin: 0 20px;
}

注意事项，这些样式可能导致富文本编辑框的上面的功能按钮间距过大，此时需要单独修改对应样式，避免<ul><li>样式冲突

.toolbar ul li{
	margin: 0px!important;
}

详细代码如下

• 编辑框代码

<div class="editor">
    <editor :content="value" @change="updateData"></editor>
</div>

.editor ol li {
	list-style: decimal;
	margin: 0 20px;
}
.editor ul li {
	list-style: disc;
	margin: 0 20px;
}
.toolbar ul li{
	margin: 0px!important;
}

• 显示页代码

  <p class="editor" v-html="editorHtml"></p>

.editor ol li {
	list-style: decimal;
	margin: 0 20px;
}
.editor ul li {
	list-style: disc;
	margin: 0 20px;
}

效果图如下