import React, {
AsyncStorage,
View,
Text
} from 'react-native';
class Screen extends React.Component {
state = {
isLoading: true
};
componentDidMount() {
AsyncStorage.getItem('accessToken').then((token) => {
this.setState({
isLoading: false
});
});
},
render() {
if (this.state.isLoading) {
return <View><Text>Loading...</Text></View>;
}
// this is the content you want to show after the promise has resolved
return <View/>;
}
}
3 回答
据我所知,你不能让
render
等一下 . 我正在做的是添加一个加载屏幕,直到AsyncStorage的承诺解决 . 请参阅以下示例:在状态对象上设置
isLoading
属性将导致重新呈现,然后您可以显示依赖于accessToken的内容 .另外,我写了一个名为react-native-simple-store的小库,它简化了AsyncStorage中的数据管理 . 希望你觉得它有用 .
基于react-native doc,您可以执行以下操作:
React-native基于Javascript,它不支持阻塞功能 . 这也是有道理的,因为我们不希望UI卡住或看起来没有响应 . 你可以做的是在渲染功能中处理它 . 即当您从AsyncStorage获取信息时,让加载屏幕重新呈现