我已经实现了fetch()请求来调用从服务器传输大量图像的api。我想在我的应用程序中加载这些图像,但是当我由于图像的大尺寸而将其实现为swiper时,应用程序会崩溃。我们可以通过其网址调整该图像的大小,因为我只获得了图像结果。您可以将我的代码视为:`
render(){
var pages = [];
for (var i = 0; i < this.props.items.length; i++) {
const imageURL = 'http://photoos.boondrive.com/'+ this.props.items[i].large_file_path + this.props.items[i].display_name;
pages.push(
<View style={{flex:1, backgroundColor:'black', justifyContent:'center', alignItems:'center'}} key={i}>
<View>
<Image
style={{width:width,height:height}}
source={{uri:imageURL}}>
</Image>
</View>
</View>
);
}
return(
<View style={{flex:1}}>
<View>
<AndroidToolBar title={'Photos'} navIcon={JResource.back} flowIcon={JResource.expandarrow}
onPress={()=>this.props.navigator.pop()}/>
</View>
<Swiper style={{flex:1}} index={this.props.items.indexOf(this.props.item)} loop={false}>
{pages}
</Swiper>
</View>
);
}
}
我已经猜到了当我将图像输入到数组中时会产生大尺寸的数组,因此当它被渲染时,应用程序会分配大约255mb的大内存,因此我无法扫描所有图像。应用程序被绞死并崩溃。如何获得我期望的输出以及如何在当前问题中优化内存。任何建议都会非常有帮助。