fix: 修复字数统计工具报错的问题

Tencent · Jul 18, 2024 · e61ec5f · e61ec5f
1 parent 28c0e81
commit e61ec5f
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 14 deletions.
diff --git a/examples/scripts/index-demo.js b/examples/scripts/index-demo.js
@@ -193,7 +193,7 @@ var basicConfig = {
       'customMenuCName',
       'theme',
     ],
-    toolbarRight: ['fullScreen', '|'],
+    toolbarRight: ['fullScreen', '|', 'wordCount'],
     bubble: ['bold', 'italic', 'underline', 'strikethrough', 'sub', 'sup', 'quote', 'ruby', '|', 'size', 'color'], // array or false
     sidebar: ['mobilePreview', 'copy', 'theme', 'publish'],
     sidebar: ['mobilePreview', 'copy', 'theme'],

diff --git a/src/locales/en_US.js b/src/locales/en_US.js
@@ -90,7 +90,6 @@ export default {
   justifyCenter: 'Center',
   justifyRight: 'Right',
   publish: 'Publish',
-  wordCount: 'Word Count',
   fontColor: 'Font Color',
   fontBgColor: 'Font Bg Color',
   small: 'Small',
@@ -102,4 +101,8 @@ export default {
   inlineCode: 'Inline Code',
   codeBlock: 'Code Block',
   editShortcutKeyConfigTip: 'double click shortcut key area to edit',
+  wordCount: 'Word Count',
+  wordCountP: 'P',
+  wordCountW: 'W',
+  wordCountC: 'C'
 };
diff --git a/src/locales/zh_CN.js b/src/locales/zh_CN.js
@@ -94,7 +94,6 @@ export default {
   justifyCenter: '居中',
   justifyRight: '右对齐',
   publish: '发布',
-  wordCount: '字数',
   fontColor: '文本颜色',
   fontBgColor: '背景颜色',
   small: '小',
@@ -105,4 +104,8 @@ export default {
   inlineCode: '行内代码',
   codeBlock: '代码块',
   editShortcutKeyConfigTip: '双击快捷键区域编辑快捷键',
+  wordCount: '字数统计',
+  wordCountP: '段落',
+  wordCountW: '单词',
+  wordCountC: '字符'
 };
diff --git a/src/toolbars/HookCenter.js b/src/toolbars/HookCenter.js
@@ -175,13 +175,14 @@ export default class HookCenter {
      */
     const currentMenuOptions = options || { name, icon: name };
     const { $cherry, customMenu } = this.toolbar.options;
+    $cherry.$currentMenuOptions = currentMenuOptions;
     if (HookList[name]) {
       this.allMenusName.push(name);
-      this.hooks[name] = new HookList[name]({ ...$cherry, $currentMenuOptions: currentMenuOptions });
+      this.hooks[name] = new HookList[name]($cherry);
     } else if (customMenu !== undefined && customMenu !== null && customMenu[name]) {
       this.allMenusName.push(name);
       // 如果是自定义菜单，传参兼容旧版
-      this.hooks[name] = new customMenu[name]({ ...$cherry, $currentMenuOptions: currentMenuOptions });
+      this.hooks[name] = new customMenu[name]($cherry);
     }
   }
 

diff --git a/src/toolbars/hooks/WordCount.js b/src/toolbars/hooks/WordCount.js
@@ -32,18 +32,29 @@ export default class wordCount extends MenuBase {
    * @returns {string} 回填到编辑器光标位置/选中文本区域的内容
    */
   onClick(selection, shortKey = '') {
-    const span = document.querySelector('.cherry-toolbar-button.cherry-toolbar-wordCount');
+    const span = this.$cherry.wrapperDom.querySelector('.cherry-toolbar-button.cherry-toolbar-wordCount');
     // 首次点击时添加监听器
     if (this.countState === 0) {
       span.addEventListener('count', () => {
         const markdown = this.$cherry.getMarkdown();
         const { characters, words, paragraphs } = this.wordCount(markdown);
-        if (this.countState === 1) {
-          span.innerHTML = `P ${paragraphs}`;
-        } else if (this.countState === 2) {
-          span.innerHTML = `W ${words}`;
-        } else {
-          span.innerHTML = `C ${characters}`;
+        const { locale } = this.$cherry;
+        switch (this.countState) {
+          case 0:
+            span.innerHTML = locale.wordCount;
+            break;
+          case 1:
+            span.innerHTML = `${locale.wordCountC} ${characters}`;
+            break;
+          case 2:
+            span.innerHTML = `${locale.wordCountW} ${words}`;
+            break;
+          case 3:
+            span.innerHTML = `${locale.wordCountP} ${paragraphs}`;
+            break;
+          case 4:
+            span.innerHTML = `${locale.wordCountC}  ${characters} &nbsp; ${locale.wordCountW} ${words} &nbsp; ${locale.wordCountP} ${paragraphs}`;
+            break;
         }
       });
 
@@ -60,8 +71,11 @@ export default class wordCount extends MenuBase {
         }, 500);
       });
     }
-    // 循环切换3种状态
-    this.countState = ((this.countState + 1) % 3) + 1;
+    // 循环切换4种状态
+    this.countState += 1;
+    if (this.countState > 4) {
+      this.countState = 0;
+    }
     span.dispatchEvent(this.countEvent);
     return selection;
   }