在本机渲染中做一个循环

Question

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

test.push(data.link)

现在，有了pop，我想画出所有的图画。现在我正在像那样手动做

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>
      )

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

Answer 1

你不应该 pop() 你的数组。相反，您可以使用 map，这将递增数组的每个条目并对其执行某些操作。例如：

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

在本机渲染中做一个循环

Do a loop in a Render in react native

loops

push

return

view

react-native