Как сохранить данные, введенные при вводе текста в плоский список - PullRequest
1 голос
/ 20 января 2020

Есть 2 текстовых ввода в Flatlist рендере и как я могу сохранить текст, введенный в 2 текстовых ввода, когда я нажимаю кнопку сохранения. Как я могу обработать onChangeText в рендеринге плоских списков.


constructor(props){
    super(props);
    this.state = {
      data:['0','1'],
      textInputs: [],
    }
  }

<FlatList
  data={this.state.data}
  renderItem={this._render.bind(this)}
  extraData={this.state}
  showsVerticalScrollIndicator={false}
/>

_render({ item, index }){
  return (
    <View style={{ width: width / 1.3, marginTop: 20, padding: 20, borderWidth: 0.5, borderColor: 'black' }}>
      <TextInput
        ref={input => { this.textInput = input }}
        placeholder={'First Name'}
        placeholderTextColor={'grey'}
        style={{ height: width / 12, width: width / 1.5, textAlign: 'center', borderColor: 'gray', borderWidth: 1 }}
        onChangeText={(text, index) => this.onChange(text, index, item)}
      />
      <TextInput
        ref={input => { this.textInput = input }}
        placeholder={'Last Name'}
        placeholderTextColor={'grey'}
        style={{ height: width / 12, width: width / 1.5, textAlign: 'center', borderColor: 'gray', borderWidth: 1, marginTop: 10 }}
        onChangeText={(text, index) => this.onChange(text, index, item)}
        value={this.state.textInputs[index]}
      />
      <TouchableOpacity onPress={() => { this.saveItem(index) }}>
        <Text style={{ textAlign: 'center', marginTop: 10 }}>
          SAVE
      </Text>
      </TouchableOpacity>
    </View>
  )
}

enter image description here

Например, если я нажимаю "Сохранить" на первом элементе рендеринга I должен получить имя и фамилию, введенные во входные данные первого элемента рендеринга. если я нажму «Сохранить» на 2-м элементе рендеринга, я получу имя и фамилию, введенные во входные данные 2-го элемента рендеринга.

...