javascript - 我可以在单个组件中进行多次提取吗？

Question

我使用 React 作为前端，使用 express.js 作为后端。我对这两个框架都不熟悉。我有一个名为 Papers 的组件，我试图首先通过 fetch post 将一些文档上传到后端服务器，然后在服务器端执行一些操作，然后我试图在同一个处理程序中从服务器取回结果。我的处理程序代码如下所示:

        handleDrop(files) {
          var data = new FormData();

          alert((files[0]) instanceof File);
          files.forEach((file, index) => {
            data.append('file' + index, file);
          });

          fetch('/file_upload', {
            method: 'POST',
            body: data
          });

          // the second fetch would crash the app.
          /*fetch('/file_upload').then(function(data){
              return data.json();
          }).then( json => {
              this.setState({
                  papers: json
              });
              console.log(json);
          });*/
        }

我的 get 方法的快速后端代码是:

app.get('/file_upload', function(req, res){
    // testing
    res.send({name:"lol"});
});

现在的问题是第二次获取会使 express 应用程序崩溃。由于我是新来的 react 和表达，如果我以正确的方式这样做，有人可以给我一些提示吗？谢谢!

服务器代码链接:https://github.com/kaiwenshi/learn-webpack/blob/master/src/server/index.js

Answer 1

如果你想做一个 POST，Express 代码应该是这样的:

app.post('/file_upload', function(req, res){
    // testing
    res.send({name:"lol"});
});

而且你只需要调用一次 fetch。响应 ({name: 'lol'}) 将在 promise 中:

    handleDrop(files) {
      var data = new FormData();

      alert((files[0]) instanceof File);
      files.forEach((file, index) => {
        data.append('file' + index, file);
      });

      fetch('/file_upload', {
        method: 'POST',
        body: data
      }).then(function(data){
          return data.json();
      }).then( json => {
          this.setState({
              papers: json
          });
          console.log(json); // logs {name: 'lol'}
      });
    }