♻️ #650 性能运行的情况下从根本上解决任务列表问题

Vanessa219 · Jul 30, 2020 · 31aa216 · 31aa216
1 parent 0813fbf
commit 31aa216
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 20 deletions.
diff --git a/demo/index.js b/demo/index.js
@@ -53,7 +53,7 @@ window.vditor = new Vditor('vditor', {
   // _lutePath: `http://192.168.0.107:9090/lute.min.js?${new Date().getTime()}`,
   _lutePath: 'src/js/lute/lute.min.js',
   toolbar,
-  mode: 'wysiwyg',
+  mode: 'ir',
   height: window.innerHeight + 100,
   outline: true,
   debugger: true,

diff --git a/src/ts/ir/process.ts b/src/ts/ir/process.ts
@@ -1,6 +1,7 @@
 import {Constants} from "../constants";
 import {getMarkdown} from "../markdown/getMarkdown";
-import {accessLocalStorage, throttle} from "../util/compatibility";
+import {removeCurrentToolbar} from "../toolbar/setToolbar";
+import {accessLocalStorage} from "../util/compatibility";
 import {listToggle, renderToc} from "../util/fixBrowserBehavior";
 import {hasClosestBlock, hasClosestByAttribute, hasClosestByClassName, hasClosestByMatchTag} from "../util/hasClosest";
 import {getEditorRange, getSelectPosition, setRangeByWbr, setSelectionFocus} from "../util/selection";
@@ -113,6 +114,7 @@ export const processToolbar = (vditor: IVditor, actionBtn: Element, prefix: stri
     if (typeElement.nodeType === 3) {
         typeElement = typeElement.parentElement;
     }
+    let useHighlight = true;
     // 移除
     if (actionBtn.classList.contains("vditor-menu--current")) {
         if (commandName === "quote") {
@@ -143,6 +145,8 @@ export const processToolbar = (vditor: IVditor, actionBtn: Element, prefix: stri
             removeInline(range, vditor, "code");
         } else if (commandName === "check" || commandName === "list" || commandName === "ordered-list") {
             listToggle(vditor, range, commandName);
+            useHighlight = false;
+            actionBtn.classList.remove("vditor-menu--current");
         }
     } else {
         // 添加
@@ -191,11 +195,14 @@ export const processToolbar = (vditor: IVditor, actionBtn: Element, prefix: stri
             }
         } else if (commandName === "check" || commandName === "list" || commandName === "ordered-list") {
             listToggle(vditor, range, commandName, false);
+            useHighlight = false;
+            removeCurrentToolbar(vditor.toolbar.elements, ["check", "list", "ordered-list"]);
+            actionBtn.classList.add("vditor-menu--current");
         }
     }
     setRangeByWbr(vditor.ir.element, range);
     processAfterRender(vditor);
-    highlightToolbarIR(vditor);
+    if (useHighlight) {
+        highlightToolbarIR(vditor);
+    }
 };
-
-export const throttleProcessToolbar = throttle(processToolbar, 200);
diff --git a/src/ts/toolbar/MenuItem.ts b/src/ts/toolbar/MenuItem.ts
@@ -1,6 +1,6 @@
 import {Constants} from "../constants";
 import {i18n} from "../i18n/index";
-import {throttleProcessToolbar} from "../ir/process";
+import {processToolbar} from "../ir/process";
 import {processToolbar as processToolbarSV} from "../sv/process";
 import {getEventName} from "../util/compatibility";
 import {updateHotkeyTip} from "../util/compatibility";
@@ -45,7 +45,7 @@ export class MenuItem {
             if (vditor.currentMode === "wysiwyg") {
                 toolbarEvent(vditor, this.element.children[0], event);
             } else if (vditor.currentMode === "ir") {
-              throttleProcessToolbar(vditor, this.element.children[0],
+                processToolbar(vditor, this.element.children[0],
                     menuItem.prefix || "", menuItem.suffix || "");
             } else {
                 processToolbarSV(vditor, this.element.children[0],

diff --git a/src/ts/util/compatibility.ts b/src/ts/util/compatibility.ts
@@ -66,16 +66,3 @@ export const updateHotkeyTip = (hotkey: string) => {
 export const isChrome = () => {
     return /Chrome/.test(navigator.userAgent) && /Google Inc/.test(navigator.vendor);
 };
-
-// 节流函数
-export const throttle = (fn: any, time: number) => {
-  let isRun = false;
-  return function(...arg: any) {
-    if (isRun) { return; }
-    isRun = true;
-    setTimeout(() => {
-      fn.apply(this, arg);
-      isRun = false;
-    }, time);
-  };
-};