Question

最近建议我使用平面列表而不是地图

在Map中，我正在 render 中做类似的事情（可行）

let CryptoData = this.props.cryptoLoaded;
let displaySearchCrypto = []
      displayCrypto = CryptoData.map(el => {
          return (<CoinCard
            no={i++}
            key={el["short"]}
            coinShortName = {el["short"]}
            coinName = {el["long"]}
            coinPrice = {el["price"].toFixed(2)}
            marketCap = {(el["mktcap"]/1000000000).toFixed(4)}
            percentChange = {el["perc"].toFixed(2)}
            vwapData={el["vwapData"].toFixed(2)}
            coinImage={"https://coincap.io/images/coins/" + el["long"] + ".png"}
            />
          )
        })
      }

按照React Native网站中FlatList的非常简单的示例，我在 return

中做了类似的事情

   <FlatList
               data={this.props.cryptoLoaded}
               renderItem={({ el }) => (
               <CoinCard
                key={el["short"]}
                coinShortName = {el["short"]}
                coinName = {el["long"]}
                coinPrice = {el["price"].toFixed(2)}
                marketCap = {(el["mktcap"]/1000000000).toFixed(4)}
                percentChange = {el["perc"].toFixed(2)}
                vwapData={el["vwapData"].toFixed(2)}
                coinImage={"https://coincap.io/images/coins/" + el["long"] + ".png"}
                />
        )}
      />

但这会引发错误，表明未定义short。有人可以告诉我我在做什么错吗？我们如何正确使用FlatList？

Answer 1

renderItem回调获取一个具有item属性的对象，因此您需要将解构更改为renderItem={({item}) => <Cmp prop={item["short"]}/>}。

正确使用FlatList的方法

1 个答案: