富文本编辑器结果格式化

Former-commit-id: 8396ff85368638200e44ccb21d8ec32081563908
Former-commit-id: fae52c391ca954e5772f44793fde1805a6561bb4
Former-commit-id: 2f60a6d5371e98bb4f1152d41937f9fceedcc6be

src/pages/demo/plugins/quill-editor/demo.vue

@@ -1,22 +1,32 @@
 <template>
   <Container type="ghost">
-    <el-card>
+    <el-card class="mb">
       <QuillEditor
         v-model="value"
         @text-change="textChangeHandler"
         @selection-change="selectionChangeHandler"
         @editor-change="editorChangeHandler">
       </QuillEditor>
-      {{value}}
+    </el-card>
+    <el-card>
+      <Highlight :code="format"></Highlight>
     </el-card>
   </Container>
 </template>
 
 <script>
+import HTMLFormat from './fn'
+import value from './value'
 export default {
   data () {
     return {
-      value: '<p><strong style="background-color: rgb(240, 102, 102); color: rgb(255, 255, 255);">Hello</strong> <strong style="color: rgb(255, 255, 255); background-color: rgb(102, 163, 224);">World</strong></p>'
+      HTMLFormat,
+      value
+    }
+  },
+  computed: {
+    format () {
+      return HTMLFormat(this.value)
     }
   },
   methods: {

src/pages/demo/plugins/quill-editor/fn.js.REMOVED.git-id

@@ -0,0 +1 @@
+b18165d6428d78e9e4430801d1ba8f34d558c23b

src/pages/demo/plugins/quill-editor/value.js

@@ -0,0 +1,9 @@
+export default `<p>
+<strong class="ql-size-large" style="color: rgb(0, 138, 0);">
+  D2 Admin
+</strong>
+by
+<strong class="ql-size-large" style="color: rgb(0, 138, 0);">
+  vue.js
+</strong>
+</p>`