AsyncStorage.getItem 在 React Native 中不起作用

Question

我正在使用 AsyncStorage.setItem 在服务器上设置数据，并尝试使用 AsyncStorage.getItem 在另一个屏幕中访问该值。 1. 我无法在 AsyncStorage 内设置 token。 2. 如何在 asyncstorage 中设置多个值，比如我希望服务器响应中的 user_id 与此 token?

一起设置

onPressRegister(){

            fetch('http://192.168.1.7:3000/users/registration',{
                method:'POST',
                headers:{
                    'Accept': 'applictaion/json',
                    'Content-Type': 'application/json',

                },
                body:JSON.stringify({
           contact:this.state.contact,
                     password:this.state.password,
                })
            })
            .then((response) => response.json())
            .then((responseData) =>
            {
                 this.setState({
                     signup: responseData
                 });
                 setTimeout(() => {
                    Actions.firstScreen();
                }, 2300);

        AsyncStorage.setItem('token' ,this.state.signup.token);
            });

    }

我就是这样取的

  componentDidMount(){
    AsyncStorage.getItem('token').then((userid) =>{
    this.setState({'userid': userid});
    console.log(userid);
    });
}

但我在 console 内看不到结果，什么也没有。 AsyncStorage.setItem 有没有错误？此外，服务器响应看起来像这样

{ error: 0,
  data: 'User registered Successfully',
  userData:
   { pwd: 'vgh',
     phone_no: '5',
     user_name: '',
     status: 1,
     date: 2018-10-23T09:23:53.671Z },
  user_id: [  { user_id: 5 } ],
  token: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9' }

另外我希望 user_id 设置在 AsyncStorage 内。这该怎么做？

Answer 1

我认为您的问题来自 setState 的异步属性。

如果您的 responseData 是一个对象（用 console.log(typeof responseData) 测试它），试一试:

AsyncStorage.setItem('token' , responseData.token);

确实，setState方法需要一段时间才能生效。 React Native 在最佳时刻设置状态，而不是在您将其写入代码（异步函数）时设置状态。它不像一个变量集..

另一件需要知道的事情是何时调用 getItem。如果您在 setItem 之后调用它（或者甚至在导航到另一个屏幕之后），它可能还没有被设置（同样的异步原因）。然后你可以这样做以确保你的项目已经设置:

AsyncStorage.setItem('token' , responseData.token, () => { ...the next instructions (like navigation function) });

是setItem方法最后调用的回调

Answer 2

您可以使用 async 和 await 从 AsyncStorage 访问值。

async componentDidMount(){
    let token = await AsyncStorage.getItem('token');
    console.log(token);
}

AsyncStorage.getItem 在 React Native 中不起作用

AsyncStorage.getItem in react native not working

javascript

react-native

asyncstorage