即使我使用 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
答案 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(如果可能)。