React-native ListView 必须点击屏幕才会加载数据
2016-07-13 23:28
399 查看
最近在改动ListView时发现ListView数据不是在进入界面之后就加载出来,而是要点击屏幕之后才会加载数据,很怪异的bug。
首先函数是这么写的:在fetchInfo()里去获取服务器里的个人信息,然后再设置到页面。整理之后发现还是逻辑问题,以后得多注意思维清晰。
问题出现了,每次都必须要点击屏幕之后才能加载数据,后来一看逻辑,觉得自己被狗日了。。。。
原因是我在setInfo里去设置个人信息,但是在fetchInfo里已经设置了fetched为true,这样render就不会再执行下面的操作了。把
这句话设置到setInfo里的setState函数里就可以了。
PS:最近版本的RN,在开启Chrome调试时也会出现点击屏幕才加载的bug,不过也可能是官方故意这么做的,毕竟以前是没有这个bug的,而且一到Chrome调试,App就会特别卡,略醉。
首先函数是这么写的:在fetchInfo()里去获取服务器里的个人信息,然后再设置到页面。整理之后发现还是逻辑问题,以后得多注意思维清晰。
fetchInfo() { if(!this.state.fetched) { var body = { userId: this.state.user_id, } ; var getSign = this.state.sign.toUpperCase() ; var getParams = 'userId=' + this.state.user_id + '&token=' + this.state.token ; var paramSign = md5(getParams) ; SELFINFO_REQUEST = SELFINFO_URL + '?sign=' + paramSign.toUpperCase() + '&body=' + JSON.stringify(body) ; var infoRequest = encodeURI(SELFINFO_REQUEST) ; fetch(infoRequest) .then((response) => response.json()) .then((response) => { this.setInfo(response); }) .then(() => { this.setState({ fetched: true }) ) } } setInfo(response) { const status = response.status ; const msg = response.msg ; if(status == 0 ) { var data = response.data ; var groupName = data.groupName ; var name = data.name ; var mobile = data.mobile ; this.setState({ group: groupName, name: name , tel: mobile, }) } else { ToastAndroid.show('个人信息获取失败,请重新登录!',ToastAndroid.SHORT) ; ... } } _changePwd() { const { navigator } = this.props ; if(navigator) { navigator.push({ name:' ChangePwd' , component: ChangePwd , }) } } _logOut() { AsyncStorage.setItem('isLogin','false').then(() => { AsyncStorage.setItem('user_id','null').then(() => { AsyncStorage.setItem('token','null') ; }) ; }).then(() => { const { navigator } =this.props ; if(navigator) { navigator.push({ name: 'App' , component: App , }) } }).done() ; } render() { if(!this.state.fetched) { return ( <View style = {styles.loadContainer}> <Text style = {styles.loadTxt} >加载中...</Text> </View> ) } else { return ( <View style = {styles.container} > ... </View> ); } }
问题出现了,每次都必须要点击屏幕之后才能加载数据,后来一看逻辑,觉得自己被狗日了。。。。
原因是我在setInfo里去设置个人信息,但是在fetchInfo里已经设置了fetched为true,这样render就不会再执行下面的操作了。把
this.setState({ fetched: true })
这句话设置到setInfo里的setState函数里就可以了。
PS:最近版本的RN,在开启Chrome调试时也会出现点击屏幕才加载的bug,不过也可能是官方故意这么做的,毕竟以前是没有这个bug的,而且一到Chrome调试,App就会特别卡,略醉。
相关文章推荐
- 完美实现Android ListView中的TextView的跑马灯效果
- android上改变listView的选中颜色
- Delphi7中Listview的常用功能汇总
- Delphi控件ListView的属性及使用方法详解
- Android ListView弹性效果的实现方法
- android中ListView数据刷新时的同步方法
- Android提高之ListView实现自适应表格的方法
- Android中实现水平滑动(横向滑动)ListView示例
- Android ListView分页功能实现方法
- C#实现ListView选中项向上或向下移动的方法
- C#下listview如何插入图片
- Listview加载的性能优化是如何实现的
- C#实现listview Group收缩扩展的方法
- jQuery学习笔记之 Ajax操作篇(一) - 数据加载
- C# listview添加combobox到单元格的实现代码
- ListView 百分比进度条(delphi版)
- Android listview多视图嵌套多视图
- ListView Adapter优化 实例
- Android用ListView显示SDCard文件列表的小例子
- Adapter实现ListView带多选框等状态的自定义控件的注意事项