1,使用SwipeableFlatList的时候:希望动态加载图片。下面是错误使用:
const data=[
{key:1,label:"hello", img: '../images/1.png ' },
{key:2,label:"hello", img: '../images/2.png' },
{key:3,label:"hello", img: '../images/3.png' }
]
<SwipeableFlatList
data={data}
renderItem={ ({item})=>(
<View >
<Image source={require(item.label) } /> //会报错,(item.label)出错,我以为是{}的问题,又加了({item.label})
</View>
)} />
后来企图使用uri:
<Image source={{uri: item.label }} /> //然并卵,依然报错
2,后来经过查阅,发现source不可以使用 (查看why),以下方法:
const m=[ 1 , 2 ], n=3;
const data = [
{ key: 1, img: 'Label 1', label: require('../images/roomimg/'+m[0]+'.png'), }, //报错
{ key: 2, img: 'Label 2', label:require('../images/roomimg/'+m[1]+'.png'), }, //报错
{ key: 3, img: 'Label 3', label:require('../images/roomimg/' +n+'.png'), }, //正确
]
<SwipeableFlatList
data={data}
renderItem={ ({item})=>(
<View >
<Image source={item.label } /> //正常显示
</View>
)} />