React map got item未定义

时间:2016-12-20 16:02:45

标签: javascript reactjs

我得到的回购没有定义。但我的console.log(json.items)我可以看到数组。

const githubRepo = React.createClass({
  getInitialState(){
    return {
      repo: []
    }
  },
  componentWillMount(){
    fetch('https://api.github.com/users/abc/repos')
     .then(response => {
      return response.json()
    }).then(json => {
      this.setState({repo: json.items})
    })
  },
  render(){
    return(
      <div>
        <ul>
          {
            this.state.repo.map(repo => 
              <li>{repo .name}</li>
            )
          }
        </ul>
      </div>
    )
  }
})

我的地图功能出了什么问题? componentWillMount意味着在渲染之前执行,hmm take应该有意义。找不到我的错误。

https://jsfiddle.net/pvg1hg0s/

1 个答案:

答案 0 :(得分:2)

您需要将json.items更改为json

this.setState({repo: json})

Here is an updated jsfiddle.

您的componentWillMount方法应如下所示

fetch('https://api.github.com/users/abc/repos')
.then(response => {
  return response.json()
}).then(json => {
  this.setState({repo: json})
})

原因是您引用为json的响应没有item的任何键,因此返回undefined。它实际上返回一个数组,然后您可以使用map循环。首先,您需要使用jsonsetState的值设置为API调用的响应。