如何使用AsyncStorage将用户输入的数据保存到表单中并保存到本地设备中

Question

现在，我正在尝试将用户输入的一些数据保存到一些表单中，并将这些数据保存在用户的本地设备中。但是，我有一个错误。(下图)

​

​

我不知道为什么和如何解决这个问题。下面是我的代码。这是“状态”。

class PersonalInfo1 extends React.Component {
 constructor(props) {
 super(props);
  this.state = {
   userInput: [
     { fullname: '' },
     { middleName: '' },
     { reason: '' },
     { birthPlaceCity: '' },
     { birthPlaceCountry: '' },
     { Citizinchip: '' },
     { aboutMaridge: '' },
     { fromTermOfMaridge: '' },
     { ToTermOfMaridge: '' },
     { nameOfSpouse:'' },
     { birthdateOfSpouse: '' },
     { fromTermOfExMaridge: '' },
     { ToTermOfExMaridge: '' },
     { nameOfExSpouse: '' },
     { birthdateOfExSpouse: '' },
    ],
   };
 }

这是代码的其余部分。

 componentDidMount() {
  AsyncStorage.getItem('userInput')
   .then((userInput) => this.setState({ userInput }));
}

 onChangeText(text, name) {
   AsyncStorage.getItem('userInput')
    .then((userInput) => {
    if (userInput !== null) {
      this.state.userInput[name] = text;
      AsyncStorage.setItem('userInput', userInput);
    }
  });
}


  const { userInput } = this.state;
  return (
    <ScrollView style={styles.container}>
    <InfoHeader navigation={this.props.navigation}>
     申請者情報１ 
    </InfoHeader>
    <Notes />
    <QuestionTextSet
      onChangeText={(text) => this.onChangeText(text, 'fullname')}
      placeholder={'例：留学太郎'}
      value={userInput.fullname}
      editable
    >
      姓名（漢字表記）
    </QuestionTextSet>

Answer 1

this.state.userInput是索引数组(0，1，2...)使用对象(例如{ fullname：'‘})作为值。因此，您不能通过以下方式访问它：

this.state.userInput[name] = text;

尝试将this.state更改为以下内容：

this.state = {
    userInput:
        {
            fullname: '',
            middleName: '',
            reason: '',
            birthPlaceCity: '',
            birthPlaceCountry: '',
            Citizinchip: '',
            aboutMaridge: '',
            fromTermOfMaridge: '',
            ToTermOfMaridge: '',
            nameOfSpouse: '',
            birthdateOfSpouse: '',
            fromTermOfExMaridge: '',
            ToTermOfExMaridge: '',
            nameOfExSpouse: '',
            birthdateOfExSpouse: ''
        }
};

..。如果这对你来说是可以接受的。