时间戳

首页 > 解决方案 > 如何发布到 reactjs 网站中的 api

javascript - 如何发布到 reactjs 网站中的 api

问题描述

我是 react 和 api 的初学者，所以我有一个关于发布到 api 的问题。我希望我必须将我的 textarea 的文本发布到 api，并且 api 将根据我的文本发送一些分数。

问题是 textarea 可能会发送类似这样的内容，这只是文本：

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua

但是 api 只接受像这样的数据，有一个前缀部分 {"data":"snippetDescription"} 否则它只会给出一个没有前缀部分的 404 错误

{"data":"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua"}

如您所见，我的 textarea 没有 {"data":""} 部分，而只有纯文本部分。

所以我尝试在 post 方法中连接它，但它给出了一个错误。这就是我尝试将第一部分连接到 textarea 文本的方式。

scoreanalysis = (snippetDescription) => {

    return fetch("api/score/", {
      method: "POST",
      body: JSON.stringify({
        snippetdesc: "{" + "data" + ":" + "snippetDescription" + "}" //this is the concatenation which doesn't work
      }),
      headers: {
        "Content-type": "application/json; charset=UTF-8"
      }
    })
      .then(response => response.json())
      .then(
        textdata => {
          this.setState({
            scoredata: textdata.scores,            
          });
          console.log(scoredata); //how do I console log scoredata
        },
        error => {
          console.log(error);
        }
      );
  };

文本区域代码

            <textarea
              placeholder="Enter your text here"
              onChange={snippetDescription =>
                this.setState({
                  snippetDescription
                })
              }
            ></textarea>

错误

Unexpected string concatenation of literals   no-useless-concat

我希望有人能告诉我如何连接前缀部分，以便我可以按照 api 的要求发送数据，以便 api 可以发回分数。谢谢你

更新：

  scoreanalysis = (snippetDescription) => {
    return fetch("api/scores", {
      method: "POST",
      body: JSON.parse('{"data":"snippetDescription"}')
    })
      .then(response => response.json)
      .then(
        textdata => {
          this.setState({
            scoredata: textdata.scores,
          });
        },
        error => {
          console.log(error);
        }
      );
  };

没有从 api 获取任何数据 .. 在控制台中显示错误为

标签： javascriptreactjsrestapi

解决方案

使用JSON.parse('{data:"textarea content"}') 您需要使用 JSON 格式来发送/接收数据。

您没有调用该函数scoreanalysis：

<textarea
    placeholder="Enter your text here"
    onChange={snippetDescription =>
        this.setState({
            snippetDescription
        })
    }
></textarea>

干杯!

推荐阅读