解决富文本出现连续空格时会被编码的问题

src/components/PinyinText.vue

@@ -17,7 +17,7 @@
             }"
             @click="correctPinyin(item, i, j, k)"
           >
-            <ruby class="py-char" :style="{ 'ruby-position': pinyinPosition === 'top' ? 'over' : 'under' }">
+            <!-- <ruby class="py-char" :style="{ 'ruby-position': pinyinPosition === 'top' ? 'over' : 'under' }">
               {{ item.text }}
               <rt
                 class="pinyin"
@@ -25,7 +25,10 @@
               >
                 {{ item.pinyin }}
               </rt>
-            </ruby>
+            </ruby> -->
+            <span v-if="pinyinPosition === 'top'" class="pinyin">{{ item.pinyin.replace(/\s+/g, '') }}</span>
+            <span class="py-char">{{ item.text }}</span>
+            <span v-if="pinyinPosition !== 'top'" class="pinyin">{{ item.pinyin.replace(/\s+/g, '') }}</span>
           </span>
         </div>
       </div>
@@ -106,15 +109,20 @@ export default {
       .pinyin-text {
         font-size: 16px;
 
+        > span {
+          display: flex;
+          flex-direction: column;
+        }
+
         .py-char {
           ruby-align: center;
         }
 
         .pinyin {
-          margin-bottom: 4px;
           font-family: 'League';
           font-size: 12px;
           font-weight: lighter;
+          line-height: 12px;
           color: $font-color;
         }
       }

src/components/RichText.vue

@@ -158,6 +158,7 @@ export default {
         menubar: false, // 菜单栏
         branding: false, // 品牌
         statusbar: false, // 状态栏
+        entity_encoding: 'raw', // raw不编码任何字符;named: 使用命名实体(如  );numeric: 使用数字实体(如  )
         setup: (editor) => {
           let isRendered = false; // 标记是否已渲染
           let that = this;