页面在网络获取网络数据的时候根据手机质量不同时间也不同,一些硬件质量不高的手机可能
会要很长一段时间,这样就会出现1至3秒的空白期,这感觉很糟糕,于是就想在这个空白期加个
ActivityIndicator,这样感觉大概会好一点
constructor(props) { super(props); this.state={ animating: true, loaded: false, }; }
fetchStories() { var uu=http://192.168.1.202:7073/ consumerapp/getmytradelist fetch(uu) .then((response) => response.json()) .then((responseData) => { if(responseData.statusCode==0){ if(responseData.data.length!=0){ this.setState({ animating: false, loaded:true, }); } } }) .catch((error) => { console.error(error); }) .done(); }
renderLoadingView() {return ( <View style={{flex:1,justifyContent:"center",alignItems:'center'}}> <ActivityIndicator size='large' color='#1980DC' animating={this.state.animating} /> </View> ); }
render(){if (!this.state.loaded) { return this.renderLoadingView(); } return( <ListView dataSource={this.state.dataSource} renderRow={this._renderRow.bind(this)} initialListSize ={5} pageSize ={5} showsVerticalScrollIndicator={false} /> ); }