javascript - AsyncStorage 和抽屉呈现始终为空

Question

我有一个带有记住我的按钮的登录屏幕，当我连接时，我想将此信息存储在 asynsctorage 中，如下所示:

    if (this.isFormValid()) {
      AccountService.login(login, password)
        .promise.then(body => {
          console.log('onLoginClick -> body', body)
          Keyboard.dismiss()
          AsyncStorage.setItem('login', login)
          if (this.state.isRememberMeSelected) {
            console.log("i'm in the storage !")

            AsyncStorage.multiSet([['login', login], ['password', 
              password], ['isRememberMeSelected', '1']])
          } else {
            AsyncStorage.multiSet([['login', ''][('password', '')], 
            ['isRememberMeSelected', '0']])
          }

当我回到我的抽屉时，我尝试读取存储并获取我的值“isRememberMeSelected”:

 async componentDidMount() {
    // await AsyncStorage.getItem('login').then(value => {
    //   console.log('DrawerLogin', value)
    //   //this.setState({login: value})
    // })
    // await AsyncStorage.getItem('password').then(value => {
    //   console.log('DrawerPassword', value)
    //   //this.setState({password: value})
    // })
    await AsyncStorage.getItem('isRememberMeSelected').then(value => {
      console.log('DrawerIsRememberMeSelected', value)

      this.setState({isRememberMeSelected: value})
    })

    // await AsyncStorage.getAllKeys((err, keys) => {
    //   console.log(' Allkeys', keys)
    // })
    } 

在我的抽屉里，我检查值“isRememberMeSelected”以删除一些项目:

  StorageMultiRemove = async () => {
       try {
         await AsyncStorage.multiRemove(['refreshToken', 
         'stripeCustomerId', 'token'], err => {
           console.log(' Dans multiRemove Error', err)
         })
       } catch (error) {
         // Error saving data
       }
     }

        isRememberMeSelected === '1' ? this.StorageMultiRemove() : 
         AsyncStorage.clear()

当我回到我的抽屉里时，这个值总是空的，除非我离开应用程序并重新启动......那里一切都设置好了......

我很适合我的情况(在执行 setItem 之前)...

我想在 asynStorage 中记录这些数据，返回我的抽屉并让这些值可用

Answer 1

您可以添加一个变量，该变量将在获取异步存储时发生变化

class Myform extends React.Component {
  state = {
    loading: true
}

然后在组件中挂载更新状态

 componentDidMount() {
    await AsyncStorage.getItem('isRememberMeSelected').then(value => {
      console.log('DrawerIsRememberMeSelected', value)
      this.setState({
        isRememberMeSelected: value,
        loading: false
       })
    })
  }

并在渲染中

render() {
   if(loading) return;  // could return loading spinner or something
}