2016-02-27 71 views
0

我目前正在寻找通过循环通过已通过此组件的所有者中的道具传递的数组来呈现类中的多个元素。下面是一个例子:尝试通过映射通过数组呈现多个ReactElements时出错

render() { 
    return (
     <div style={this.styles.container}> 
      {this.props.matchup 
       ? this.renderMatchupWithTeams(this.props.matchup) 
       : this.renderDefaultMatchup()} 
     </div> 
    ) 
} 

然后......

renderMatchupWithTeams(matchup) { 
    console.log('renderMatchupWithTeams', matchup); 
    return matchup.map(team => { 
     console.log(`team: ${team.name}, seed: ${team.seed}`); 
     return (
      <Team name="UCLA" 
         seed={matchup.seed}/> 
     ) 
    }); 
}; 

日志中包括高亮显示按预期在日志中值回归的事实,但球队组件不。

有关为什么组件未按预期呈现的任何想法?请注意,在这种情况下,forEach的结果与map相同。

**代码已被更新,以反映正确的答案**

+1

你的'renderMatchupWithTeams'函数返回undefined。你应该阅读一下'Array#map'是如何工作的。如果你返回matchup.map,事情就会开始工作。 – Interrobang

回答

2

在我的部分总监督。当然,当.map()应用于数组时,新数组是预计为。因此,我们必须返回 matchups.map才能获得创建(投影)的新值(数组)。

+0

你会附加固定的代码并接受这个答案吗?这样可以帮助未来的访问者。 – Pavlo

+0

绝对。请参阅上面编辑的代码和注释。 –

+0

如果不编辑问题的其余部分,则不应编辑原始代码;现在看起来你正在使用工作代码,所以你的问题没有意义。可能会保留原始代码,然后添加一个脚注,其中包含一条说明您已意识到错误的附加信息,并在工作代码中附加解释,或者将工作代码放入此答案中,并保留原始问题不变。 (像帕夫洛建议的那样接受这个答案也会很好) – philraj

相关问题