首页 > 解决方案 > 在反应原生的渲染中做一个循环

问题描述

我正在尝试在我的渲染中做一个循环。我用push(在循环中)放入了一个变量很多'uri'

test.push(data.link)

现在,有了流行音乐,我想画出所有的照片。现在我正在像那样手动执行此操作

return (
    <View style={styles.container}>
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
        <Image style={ { width: 400, height: 400 } } source={ { uri: test.pop() } } />
      </View>
      )

但我无法绘制所有图片,因为我需要为每张图片都这样做。有人知道我可以如何显示所有照片或特定数量,而不必像上面那样为每个 pone 做一张

标签: react-nativeloopsviewreturnpush

解决方案


你不应该pop()你的阵列。相反,您可以使用map, 它将增加数组的每个条目并对其进行处理。例如:

return (
  <View style={styles.container}>
    {test.map(link => (
      <Image style={ { width: 400, height: 400 } } source={ { uri: link } } />
    ))}
  </View>
)

推荐阅读