wangEditor上传图片

11.png

wangEditor的使用参考我以前的文章

const editor = new wangEditor(`#demo1`);
  //开启上传图片 关闭填写地址栏模式
    editor.config.uploadImgServer = "/api/upload-img";
    editor.config.excludeMenus = [
      //定义不需要显示的菜单
      "video"
    ];
    //关闭全屏显示
    editor.config.showFullScreen = false;
    // 创建编辑器
    editor.create();
    editor.config.customUploadImg = (resultFiles, insertImgFn) => {
      //拿到上传的文件 
      console.log(resultFiles);
      //将上传的文件转成url传入insertImgFn方法 例如下面的阿里云OSS
      insertImgFn(
        "https://img2.baidu.com/it/u=462228203,2921554562&fm=26&fmt=auto"
      );

      //这部分是先把图片上传到阿里云拿到fileUrl,在调用insertImgFn
      // let alist = [];
      // for (let index = 0; index < resultFiles.length; index++) {
      //   uploadOSS(resultFiles[index], resultFiles[index].name, "ZKX/").then(
      //     fileUrl => {
      //       alist.push({ idx: index, fileUrl: fileUrl });
      //       if (alist.length == resultFiles.length) {
      //         const newalist = alist.sort(compare("idx"));
      //         newalist.forEach(o => {
      //           insertImgFn(o.fileUrl);
      //         });
      //       }
      //     }
      //   );
      // }
    };

你可能感兴趣的:(wangEditor上传图片)