将输入数据保存在异步存储中

Question

我一直在尝试在异步存储上保存输入数据，但每当我在输入后返回时，它会显示以前的数据，而不是更新的数据。这是我认为需要进行一些更改的代码。

constructor(props) {
    super(props)
    this.state = {
      userData: {
        address: ''
      }
    }
  }
  saveAddressEdit = (fieldName, fieldValue) => {
    AsyncStorage.setItem(userData.address, fieldValue)
  }
  render() {
    const {address} = this.state.userData

    return (
      <Input placeholder=" Type your Address:" 
             onChangeText={(address) => this.setState({address})}
             value={address} />
          
         <Button full danger  onPress={()=>this.saveAddressEdit('address', address)} style={{backgroundColor:'#ff0000'}}>      
           );
          }
       

提前致谢。

Answer 1

如果你想坚持使用AsyncStorage在组件生命周期中解决问题，那么你应该首先正确保存它，一旦你回到屏幕上，获取它并将其填充回你的状态，因为组件的状态需要使用你的AsyncStorage重新初始化。

以下代码应该有助于将地址初始化回存储的地址：

componentDidMount () {
   AsyncStorage.getItem('address').then(value => {
      if (value) {
         this.setState({address: value});
      }
   })
}

以下指定将数据设置为AsyncStorage的正确方法：

 saveAddressEdit = async (fieldName, fieldValue) => {
    await AsyncStorage.setItem(fieldName, fieldValue)
 }

或者你也可以像我在上面的getItem那样的承诺方式，如setItem(fieldName, fieldValue).then(value => console.log('saved'))，但因为我们不需要处理then中的任何东西所以我抵制在这些地方使用诺言。

希望这可以帮助。快乐编码:)