在调用函数 React-Native 上保存 textInput 的值

Question

我正在从API获取一些TextInputs并将它们推送到数组中。然后，我保存来自用户的输入文本以及文本输入对象具有的所有键和值。但是，当我保存时，每次我对文本进行更改时，它都会保存。我想在视图中进一步调用函数时保存所有内容并将其推送到数组。基本上，我希望状态仅在调用函数时推送到数组，而不是每次更改文本时。

我感谢任何建议！如果问题不够清楚，请告诉我。

myInputFields = {
   myTextFields: [],
};
textfieldsObject = () => {
const obje = this.props.navigation.state.params.item;
var keyvalue_to_json = JSON.parse(obje.keyValues);
var foundTextFields = [];
for (let i = 0; i < keyvalue_to_json.inputFields.length; i++) {
  if (keyvalue_to_json.inputFields[i].type === 'textfield') {
    foundTextFields.push(<TextInput style={{ borderWidth: 1 }}
      onChangeText={(text) => {
        keyvalue_to_json.inputFields[i].inputValues = text;
        this.myInputFields.myTextFields.push(keyvalue_to_json.inputFields[i])
      }}
    >{keyvalue_to_json.inputFields[i].placeholderText}</TextInput>)</Text>)
  }
}

}

Answer 1

每次

键入或更改文本时都会调用onChangeText 事件。您需要使用 onEndEditing 事件，该事件仅在文本输入结束时触发。因此，您的TextInput代码将是：

<TextInput style={{ borderWidth: 1 }}
  onEndEditing={(e) => {
    keyvalue_to_json.inputFields[i].inputValues = e.nativeEvent.text;
    this.myInputFields.myTextFields.push(keyvalue_to_json.inputFields[i])
  }}
>{keyvalue_to_json.inputFields[i].placeholderText}
</TextInput>