[英]react native map method not rendering
我正在做一个简单的加密货币应用程序,以显示每日价格和变化。 当使用第一个硬币的信息以0索引呈现视图时,将显示数据,但是当使用map方法时,将不显示任何内容...这是视图的代码:
<View style={styles.container}>
<ScrollView contenContainerStyle={styles.coinList}>
{this.state.coinList.map((coin, index) => {
alert (coin.symbol + ': ' + coin.price);
<CoinInfo
key={index}
symbol={coin.symbol}
name={coin.name}
price={coin.price}
change={coin.change}
active={false}
onPress={this.fonPress}
/>;
})}
</ScrollView>
<View/>
const styles = StyleSheet.create({
container: {
flex: 62,
backgroundColor: '#40137A',
alignItems: 'center',
justifyContent: 'center',
},
loading: {
justifyContent: 'center',
},
coinList: {
flex: 1,
flexDirection: 'row',
flexWrap: 'wrap',
justifyContent: 'space-around',
}
});
我使用了警报来查看地图是否正在运行,并且它会向我警报阵列中的8个硬币中的7个...
感谢您的帮助
使用Array.map方法时,应返回要添加到结果数组中的元素。
您会看到警报,因为该函数正在运行,但是由于您没有返回子元素,因此结果数组将无法呈现。
尝试这个:
{this.state.coinList.map((coin, index) => {
alert (coin.symbol + ': ' + coin.price);
return <CoinInfo
key={index}
symbol={coin.symbol}
name={coin.name}
price={coin.price}
change={coin.change}
active={false}
onPress={this.fonPress}
/>;
})}
我建议您查看以下链接以更好地了解Array.map:
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/map
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.