React Draft Wysiwyg：当我点击＆＃34;添加＆＃34;按键

Question

在React.js应用程序上，我尝试让https://jpuri.github.io/react-draft-wysiwyg/#/docs编辑器上传图像并将其嵌入编辑器的内容中。

到目前为止，我设法用这段代码做到了这一点：

import React, { Component } from 'react';
import { Editor } from 'react-draft-wysiwyg';
import {convertFromRaw, convertToRaw, EditorState} from 'draft-js';    
import "../../node_modules/react-draft-wysiwyg/dist/react-draft-wysiwyg.css"
import "../../node_modules/draft-js-image-plugin/lib/plugin.css"



export default class CustomEditor extends Component {

  uploadCallback(file) {

    return new Promise(
      (resolve, reject) => {
        var reader=new FileReader();

        reader.onloadend = function() {
          Meteor.call('fileStorage.uploadFile',reader.result,file.name,file.type,(err,response)=>{
              console.log(response)
             if(err){
               reject(err)
             }

             resolve({ data: { link: response.data.url } });
          })
        }

        reader.readAsDataURL(file);
      }
    );
  }

  render() {

    const config={
      image: { uploadCallback: this.uploadCallback }
    }

    return (
      <div className="container-fluid">
        <Editor toolbar={ config } />
      </div>
    )
  }
}

但我的问题是，当我选择文件时，图片上传过程会被启动，当我点击＆＃34;添加＆＃34;我想要启动上传过程。你在下面的图片中看到的按钮：

那我该怎么做呢？

Answer 1

It's not possible to change this behaviour.

The only option you can provide is uploadCallback, see the docs.

You can find the source for the upload code here, it's quite clear, it's not possible.