我是靠谱客的博主 可耐咖啡,这篇文章主要介绍富文本wang-editor自定义上传,现在分享给大家,希望可以做个参考。

const editorConfig: Partial<IEditorConfig> = {
    placeholder: "请输入内容...",
    MENU_CONF: {
      uploadImage: {
        server: "/api/upload",//无意义
        base64LimitSize: 5 * 1024, // 5kb 直接转成base64
        // maxFileSize: 1 * 1024, // 1M

        // // 最多可上传几个文件,默认为 100
        // maxNumberOfFiles: 1,

        // 自定义上传
        async customUpload(file: File, insertFn: InsertFnType) {
          // 自己实现上传,并得到图片 url alt href
          // 最后插入图片
          if (!(file.type === "image/jpeg" || file.type === "image/png")) {
            message.warning("该图片格式不符合要求!");
            return;
          }
          if (file.size > 1024 * 1024 * 20) {
            message.warning("图片大小不能超过20M!");
            return;
          }
          let formData = new FormData();
          formData.append("fileList", file);
          const res = await upLoadRich(formData);//调用后端上传接口
          if (res[0]) {
            insertFn(res[0].fileUrl, res[0].fileName, res[0].fileUrl);
          }
        },
      },
      uploadVideo: {
        server: "/api/upload",
        // 单个文件的最大体积限制,默认为 10M
        // maxFileSize: 200 * 1024 * 1024, // 5M
        // 自定义上传
        async customUpload(
          file: File,
          insertFn: (url: string, poster: string) => void
        ) {
          if (file.type !== "video/mp4") {
            message.warning("请上传mp4格式视频!");
            return;
          }
          let formData = new FormData();
          formData.append("fileList", file);
          const res = await upLoadRich(formData);
          if (res[0]) {
            insertFn(res[0].fileUrl, "");
          }
        },
      },
    },
  };

最后

以上就是可耐咖啡最近收集整理的关于富文本wang-editor自定义上传的全部内容,更多相关富文本wang-editor自定义上传内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(50)

评论列表共有 0 条评论

立即
投稿
返回
顶部