Question

我有以下代码通过后端的API调用获取数据。如果我将***中的链接加载到浏览器，则当我使用以下代码进行AJAX调用时，API的确会返回结果[[“ 2016-03-31T00：00：00”]'，我的状态为200，响应显示我从服务器获得了正确的返回，但是浏览器显示“错误：无法获取”错误。我想做的就是对该网址进行AJAX调用并显示结果。

错误截图

代码

 componentDidMount() {
        fetch("***")
          .then(res => res.json())
          .then(
            (result) => {
              this.setState({
                isLoaded: true,
                items: result.items
              });
            },
            (error) => {
              this.setState({
                isLoaded: true,
                error
              });
            }
          )
      }

      render() {
        const { error, isLoaded, items } = this.state;
        if (error) {
          return <div>Error: {error.message}</div>;
        } else if (!isLoaded) {
          return <div>Loading...</div>;
        } else {
          return (
            <ul>
              {items.map(item => (
                <li key={item.name}>
                  {item.name} {item.price}
                </li>
              ))}
            </ul>
          );
        }
      }
    }

Answer 1

使用promise时，通常在then（）块之后使用catch（）块来处理错误。这就是为什么它可用于本机提取API的原因。

fetch("***")
          .then(res => res.json())
          .then(
            (result) => {
              this.setState({
                isLoaded: true,
                items: result.items
              });
            }).catch((error) => {
              this.setState({
                isLoaded: true,
                error
              });
            }
          )

ReactJS Ajax调用返回200和结果，但错误：无法获取

1 个答案: