Question

我正在使用React js并希望使用Fetch从API获取数据。问题是我无法显示获取结果，因为React的返回范围是执行的fetch方法！请帮忙解决这个问题???

这是执行Fetch的函数的一部分：

initFourSquare = () => {
       return fetch(FourSquareAPI)
           .then(data => {
             return data.json()
           })
          .catch((error) => {
            console.log(error.message)
          })
    };

这是反应的渲染部分，我调用了函数（initFourSquare）

  render() {

     var info = []
     this.initFourSquare().then(response => {
            info = response.response.venues
              console.log(info) //the result is appear here
          })
      setTimeout(function(){ console.log(info[0].name) }, 1000);//the result is appear here

    return (
            <div>
              <h1>{info}</h1> // it display nothing !!!
            </div>
    );
  }
}

Answer 1

任何API /异步调用都不应该在render函数中进行，你应该在componentDidMount函数中执行它，如果它要完成一次，这似乎是你的情况并将响应设置为你可以在渲染中使用的状态。确保在使用状态变量

之前正确初始化状态或提供存在的条件检查

import __builtin__

def open(*args, **kwargs):
    kwargs["encoding"] = "utf8"
    return __builtin__.open(*args, **kwargs)

如何在React中延迟返回，直到完成提取

1 个答案: