Блог

В этом коде все, чего я пытаюсь достичь, это то, что я получаю введенное значение внутри реквизита значения Textinput . Однако то, что я получаю, равно нулю. A setState является асинхронным, я отстаю на один шаг. Я новичок в react, и я не знаю, как я могу создать функцию обратного вызова, которая может дать мне текущее значение.

Я также хотел бы позже использовать map и создать динамическую форму, я ценю решение, которое может работать и для функции map.

Спасибо

 import React from 'react';
import {
  View,
  TextInput,
} from 'react-native';

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      Email: null,
      Password: null,
      Address: null,
    };
  }

  EnterValue = (name) => {
    return (text) => {
      this.setState({
        [name]: text,
        
      });
    };
  };

  render() {
    return (
      <View>
        <TextInput
          placeholder="enter email"
          value={this.state.Email}
          onChangeText={this.EnterValue('Email')}
          style={{ borderWidth: 2, borderColor: 'skyblue', margin: 20 }}
        />

        <TextInput
          placeholder="Password"
          value={this.state.Password}
          onChangeText={this.EnterValue('Password')}
          style={{ borderWidth: 2, borderColor: 'skyblue', margin: 20 }}
        />

        <TextInput
          placeholder="Address"
          value={this.state.Address}
          onChangeText={this.EnterValue('Address')}
          style={{ borderWidth: 2, borderColor: 'skyblue', margin: 20 }}
        />
      </View>
    );
  }
}
  

Я бы сделал что-то вроде этого

 onChangeText={(e) => this.EnterValue(e.target.value, 'Email')}
  

(Я не уверен в e.target.value, если оно равно нулю или не определено, передайте e.target и запишите его, чтобы увидеть, какие значения вы можете получить от него)

затем измените свою функцию следующим образом

 EnterValue = (value, inputName) => this.setState({ [inputName]: value});