您的位置:首页 > Web前端 > React

React-native ListView 必须点击屏幕才会加载数据

2016-07-13 23:28 399 查看
最近在改动ListView时发现ListView数据不是在进入界面之后就加载出来,而是要点击屏幕之后才会加载数据,很怪异的bug。

首先函数是这么写的:在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就会特别卡,略醉。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  listview rn 数据加载