阵营为每个对象的缩略图动态

问题描述：

好家伙我试着去创造我personas ={[]}每个缩略图的DIV它应该使用this.props.personas.map像这样阵营为每个对象的缩略图动态

{this.props.personas.map(thumbnail => { 
     return <div><img src={this.props.thumbnail /}></div> 
    })}

我已经尝试过这一点，但这里失败的是我的垃圾箱。 Bin

有什么建议吗？什么即时做错了

检查您的控制台。数组或迭代器中的每个子元素都应该有一个唯一的“键”属性。 –

钥匙应该是唯一的，我已经添加索引作为您的箱子中的钥匙 – Chetan

答

我假设图像的src是在人物角色数组（我知道你称之为缩略图，但为了一致的缘故，让我们用persona代替）？如果是这样，你应该使用的人物角色this.props.thumbnail

{ 
    this.props.personas.map((persona, i) => { 
    return <div key={i}><img src={persona.thumbnail} /></div> 
    }) 
}

答案放在一边，它是使用key支撑动态生成组件好的做法。请在此处阅读钥匙：https://facebook.github.io/react/docs/lists-and-keys.html#keys

它应该是'persona.thumbnail'，'persona'是一个对象。 –

@SaugatAcharya好的。编辑我的答案。 –