TextInput со значением не меняет значение - PullRequest
Новая
       7

TextInput со значением не меняет значение

0 голосов
/ 09 января 2019

В моем приложении "native-native" у меня есть API, из которого я получаю данные, и я устанавливаю данные в свои входные значения, пользователь должен иметь возможность редактировать эти входные данные и обновлять, но когда я пытаюсь ввести во входных данных он ничего не печатает, а значение остается неизменным, вот код TextInput: 

<TextInput
   placeholder= Email
   value={this.state.info.email}
   onChangeText={email => this.setState({ email })}/>

Ответы [ 3 ]

0 голосов
/ 09 января 2019

сначала необходимо объявить состояние, а затем применить это состояние к значению TextInput. 

state: {
     email: ''
}

и для заполнения TextInput в первый раз значением API, которое необходимо добавить 

componentDidMount(){
  this.setState({email: this.props.info.email});
}

и ваш TextInput будет выглядеть следующим образом: 

<TextInput
   placeholder= Email
   value={this.state.email}
   onChangeText={value=> this.setState({ email: value})}/>

Надеюсь, что это работает ..

0 голосов
/ 10 января 2019

Поскольку я не думаю, что электронная почта является единственной опорой вашего state.info, я рекомендую вам правильно использовать setState(), чтобы изменить только это поле. По неизменности и ES6, что-то вроде: 

<TextInput
  placeholder="Email"
  value={this.state.info.email}
  onChangeText={text =>
    this.setState(state => {
      return {
        ...state,
        info: {
          ...state.info,
          email: text
        }
      };
    })
  }
/>;

Подробнее об обработке TextInput здесь

0 голосов
/ 09 января 2019

Я думаю, у вас есть ошибка в вашей функции обработчика. Когда вы вызвали setState, вы обновили this.state.email, но в качестве значения ввода текста, которое вы использовали this.state.info.email, вы также записали объект события в электронное письмо вместо нового значения поля (event.target.value). Вы должны использовать что-то вроде этого. 

onChangeHandler = event => {
  const newEmail = event.target.value
  this.setState({ info: {email: newEmail})}
}

<TextInput
  placeholder= Email
  value={this.state.info.email}
  onChangeText={this.onChangeHandler.bind(this)} />
...