反应本机中的AsyncStorage.getItem无法正常工作

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' }

我也想在AsyncStorage设置user_id 。 这个怎么做？

Answer 1

U可以使用async并await从AsyncStorage访问该值。

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

Answer 2

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

如果您的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方法结尾处调用的回调