GET 400 和 Uncaught (in promise) 错误:请求失败,状态码为 400

时间:2021-07-03 16:52:57

标签: javascript json reactjs api axios

即使我使用 if(e.target.value === "") 进行检查,当 textarea 为空时也会出错。

onFirstChange = async (e) => {

const response = await axios.get("https://translate.yandex.net/api/v1.5/tr.json/translate?key=" + key +
    "&text=" +
    e.target.value +
    "&lang=en");

if (e.target.value === "") {
  this.setState({
    firstArea: "",
    lastArea: "",
  });
} else {
  this.setState({
    firstArea: e.target.value,
    lastArea: response.data.text,
  });
}


};

文本区域:

<textarea
            className="form-control"
            id="firstArea"
            name="firstArea"
            rows="5"
            placeholder="Enter"
            defaultValue={this.state.firstArea}
            onKeyUp={this.onFirstChange}
          ></textarea>
<textarea
                className="form-control"
                id="lastArea"
                name="lastArea"
                rows="5"
                placeholder=" "
                defaultValue={this.state.lastArea}
                onKeyUp={this.onLastChange}
              ></textarea>

错误:

获得 400

未捕获(承诺)错误:请求失败,状态码为 400

1 个答案:

答案 0 :(得分:1)

您的新编辑清楚地表明了这一点。您不能发送带有空文本参数的 API 调用。这就是为什么您只会在这种情况下收到错误。

仅当您的文本区域中有一些值时才调用它。

en though I checked with if(e.target.value === ""), it gives an error when the textarea is empty.

onFirstChange = async (e) => {



if (e.target.value === "") {

  this.setState({
    firstArea: "",
    lastArea: "",
  });
} else{

const response = await axios.get("https://translate.yandex.net/api/v1.5/tr.json/translate?key=" + key +
    "&text=" +
    e.target.value +
    "&lang=en");


  this.setState({
    firstArea: e.target.value,
    lastArea: response.data.text,
  });
}


};

提示:在代码中直接使用 API 调用之前,请尝试使用 Postman/cURL 等工具测试它们,甚至只是在浏览器中打开 url(如果可能)。