{
this.state.list_expand ? (
<div style={{marginTop: 10, marginBottom: 10}}>
<List className="my-list">
{
platforms.map((p, index) => (
<div key={p.key}>
{
this.state.choose_card === index ? null : (
<List.Item
key={p.key}
thumb={p.thumb}
multipleLine
onClick={() => this.chooseCard(index)}
>
{p.text} <Brief>{p.brief}</Brief>
</List.Item>
)
}
</div>
))
}
</List>
</div>
) : null
}
首先我們先用三目運算符來控制僅在list_expand==true才會顯示淳蔼,然后我通過map方法傳入p和index豺妓,相當于把 p作為currentValue,并傳入index。
這樣我們就能把platforms數(shù)組中的每一項都顯示出來驶沼,并能直接用p.thumb調(diào)platforms數(shù)組中的thumb屬性。