首页 > 解决方案 > 获取 AsyncStorage 数据到

问题描述

我正在尝试从 AsyncStorage (React-Native) 获取用户名。并将这些数据解析为<Text></Text>.

我当前的代码什么也不显示。

获取数据的代码

getCreds = () => {
    return AsyncStorage.getItem('username')
}
...
<Text>{this.getCreds()}</Text>

HomeScreen.js

存储数据的代码

export const onSignIn = (username, pswd) => {
  AsyncStorage.setItem('username', username).done();
  AsyncStorage.setItem('pswd', pswd).done()
}

auth.js

我的问题是如何从 AsyncStorage 获取用户名并解析为<Text></Text>我的渲染函数中的 a ?

标签: javascriptreact-nativeasyncstorage

解决方案


您的问题是您可能通过名称获得的 AsyncStorage.getItem 是一个异步调用,因此您在调用它时需要考虑到这一点。

这样称呼

constructor(props) {
    super(props);
    this.state = {username: null};
    this.loadCredentials();
}

async loadCredentials() {
    try {
        const username = await AsyncStorage.getItem('username');
        this.setState({username: username});
    }
    catch (error) {
        // Manage error handling
    }
}

render() {
     const {username} = this.state;
     if (username != null) {
         return <Text>{username}</Text>
     }
     return <Text>Loading text...</Text>
}

推荐阅读