在javascript中执行地图内的地图？

Question

我有这段代码：

_renderChannels() {
     return this.state.channelsData.map(channelData => {
       return this.state.channelsStreamData.map(channelStreamData => {
          return <Channel channelData={channelData} channelStreamData={channelStreamData} />
      })
    });
  }

我想在Channel组件上映射道具，但是当它应该只有3次时，Channel组件会被重复返回9次？所以我想映射channelData和channelStreamData的数据并返回组件Channel。我尝试删除它里面的地图但是当我不返回它时它不会被返回。帮助

Answer 1

这应该这样做：

_renderChannels() {
    return this.state.channelsData.map((channelData, i) => <Channel 
        channelData={channelData}
        channelStreamData={this.state.channelStreamData[i]}
    />);
}

我添加了i索引参数。这样我就可以从this.state.channelStreamData数组中获取相同的元素。