:bug: fix #858

CHANGELOG.md

@@ -88,6 +88,7 @@
 
 ### v3.7.3 / 2020-12-xx
 
+* [858](https://github.com/Vanessa219/vditor/issues/858) 预览模式下应禁用工具栏上传按钮 `修复缺陷`
 * [849](https://github.com/Vanessa219/vditor/issues/849) 固定工具栏模式下点击全屏打开后导航栏位置异常 `修复缺陷`
 * [855](https://github.com/Vanessa219/vditor/issues/855) 添加全屏 z-index 设置 `引入特性`
 * [850](https://github.com/Vanessa219/vditor/issues/850) 工具栏大纲按钮点击后焦点并未回到内容区 `改进功能`

src/ts/preview/image.ts

@@ -9,11 +9,11 @@ export const previewImage = (oldImgElement: HTMLImageElement, lang: keyof II18n
         <svg><use xlink:href="#vditor-icon-redo"></use></svg>
         ${i18n[lang].spin}
       </span>
-      <span class="vditor-img__btn"  onclick="this.parentElement.parentElement.outerHTML = '';document.body.style.overflow = 'visible'">
+      <span class="vditor-img__btn"  onclick="this.parentElement.parentElement.outerHTML = '';document.body.style.overflow = ''">
         X &nbsp;${i18n[lang].close}
       </span>
     </div>
-    <div class="vditor-img__img" onclick="this.parentElement.outerHTML = '';document.body.style.overflow = 'visible'">
+    <div class="vditor-img__img" onclick="this.parentElement.outerHTML = '';document.body.style.overflow = ''">
       <img style="width: ${oldImgElement.width}px;height:${oldImgElement.height}px;transform: translate3d(${oldImgRect.left}px, ${oldImgRect.top - height}px, 0)" src="${oldImgElement.getAttribute("src")}">
     </div>
 </div>`);

src/ts/toolbar/Upload.ts

@@ -1,6 +1,7 @@
 import {Constants} from "../constants";
-import {uploadFiles} from "../upload/index";
+import {uploadFiles} from "../upload";
 import {MenuItem} from "./MenuItem";
+import {getEventName} from "../util/compatibility";
 
 export class Upload extends MenuItem {
     constructor(vditor: IVditor, menuItem: IMenuItem) {
@@ -17,9 +18,18 @@ export class Upload extends MenuItem {
     }
 
     public _bindEvent(vditor: IVditor) {
+        this.element.children[0].addEventListener(getEventName(), (event) => {
+            if (this.element.firstElementChild.classList.contains(Constants.CLASS_MENU_DISABLED)) {
+                event.stopPropagation();
+                event.preventDefault();
+                return;
+            }
+        });
         this.element.querySelector("input").addEventListener("change",
             (event: InputEvent & { target: HTMLInputElement }) => {
                 if (this.element.firstElementChild.classList.contains(Constants.CLASS_MENU_DISABLED)) {
+                    event.stopPropagation();
+                    event.preventDefault();
                     return;
                 }
                 if (event.target.files.length === 0) {