React native fetch ...像我5岁时解释它

时间:2018-12-28 20:00:52

标签: arrays json react-native iterator fetch

export default class App extends Component {
  state = {
    data: []
  };

fetchData = async () => {
    const response = await fetch("https://randomuser.me/api?results=5"); // Replace this with the API call to the JSON results of what you need for your app.
    const json = await response.json(); 
    this.setState({ data: json.results }); // for the randomuser json result, the format says the data is inside results section of the json.
  }; 

所以,我在React Native的App.js文件中有这段代码。 randomuser.me是一个只为您提供随机用户的网站。现在将其用作测试URL。我不太了解代码在做什么,以至于无法将其用于项目的其他部分。我能够成功显示5个用户结果,但是现在我想再次访问它们并遍历状态的data属性。

tldr;我可以使用data [i]在for循环中访问从提取中获取的数据吗?请指教。我想查看用户输入是否匹配存储在状态数据属性中的响应中的任何项目。

1 个答案:

答案 0 :(得分:0)

好吧,刚做完了,就可以了。您从互联网检索数据。 “ https://randomuser.me/api?results=5”是一种API,有很多不同的API,每个API都有自己的检索数据的方法。如果您在浏览器中输入“ https://randomuser.me/api?results=5”,将会看到一个JSON,一些API以JSON格式存储数据,其他以数组格式存储。 在这种情况下,JSON只有一个子“ results”,这就是为什么要存储“ json.results”的原因。

很有趣。您要做的只是javascript。 将json.results存储在变量中 然后遍历

 var Results = json.results //store it in a variable
    for(var i = 0;i<Object.keys(Results).length;i++){ //iterate
      var CurrentUser = Results[Object.keys(Results)[i]] // i use this because some JSOn have random keys
      if(CurrentUser.gender==='male'){//if you meet a condition
      //do whatever you want
      }

}

如果它是数组,还可以使用“ .map”