javascript - React Native，动态显示图像

Question

我目前正在处理一个页面，我想在该页面上显示一个文件夹中的所有图像。我试过下面的代码:

return (
 <View>
  {images.map(r => 
   <Image source={require('../assets/image/' +r+'.png')} />
  )}    
 </View>
);

这是我得到的结果:

Error: pages/etc.js:Invalid call at line: require('../assets/image/' + r + '.png')

我应该怎么做才能解决这个问题？谢谢。

Answer 1

require 在这种特定情况下，React Native 不适用于动态路由(带变量的路由)。应该需要图像及其 pur 字符串路径。例如，您可以通过以下方式完成您想要的操作:

//.....
const images =[require('../assets/image/1.png'),require('../assets/image/2.png')]
//.....
return (
 <View>
  {images.map(i => 
   <Image source={{uri:i}} />
  )}    
 </View>
);