React Native：无法映射状态数组

Question

我试图找出如何通过api调用映射存储在我的状态中的对象数组。

我的状态对象：

state = {
    isLoading: false,
    event: []
};

我的渲染功能：

{this.state.event.musicStyle.map((style, index) => {
    return <Text>{style}</Text>;
})}

我的API响应：

this.state.event的控制台日志：  

错误消息：

TypeError: Cannot read property of 'map' of undefined

我在这里做错了什么？任何帮助都非常感谢。

Answer 1

this.state.event是一个数组，因此this.state.event.musicStyle将始终未定义...

你想要的是

componentDidMount() {
  return fetch(callToApi)
    .then(result => result.json())
    .then(result => this.setState({event: result})
}
render() {
  return (
    {this.state.event.map((event) => {
      event.musicStyle.map((style) => {
       return <Text>{style}</Text>;
      })  
    })}
  )
}