时间戳

首页 > 解决方案 > React 应用程序中的映射函数仅显示一个结果

arrays - React 应用程序中的映射函数仅显示一个结果

问题描述

我正在尝试从 a 中获取结果json link，如下所示：

state = {
   users: []
};
componentDidMount() {
  this.getUsers();
}
getUsers = () => {
axios
  .get("https://api.racidy.com/livetv/uploads/m-jsonobjfin.json")
  .then(data => this.setState({ users: [JSON.parse(data.data.substring(25))] }))
  .catch(err => {
    console.log(err);
    return null;
  });
};

从这段代码中，我可以获得我需要的所有数据..但是当我尝试显示结果时：

render() {
  return (
  <Layout>
    <div>
      {this.state.users.length === 0 ? (
        <div>Loading...</div>
      ) : (
        this.state.users.map((e, i) => {
          return <div key={i}>{e.game[i]['imgGame']}</div>;
        })
      )}
    </div>
   ...

渲染方法上的“console.log(this.state.users)”的结果 在此处输入图像描述

我只得到一个结果..第一个，

我做错了什么？

标签： arraysjsonreactjsaxios

解决方案

您正在迭代用户，它只有一个元素"game"。

你应该迭代"game"。

render() {
  return (
  <Layout>
    <div>
      {this.state.users.length === 0 ? (
        <div>Loading...</div>
      ) : (
        this.state.users[0].game.map((e, i) => {
          return <div key={i}>{e['imgGame']}</div>;
        })
      )}
    </div>
   ...

推荐阅读