2016-11-17 7 views
0

Я создал форму с использованием React Native, однако я хочу, чтобы кнопка записи была отключена, а TextInput пуста, и когда весь TextInput заполнен, кнопка возвращается к включенному.Кнопка - Включить и отключить

Как это сделать? Можете ли вы прислать мне примеры?

ответ

2

Вы можете сделать что-то вроде этого:

class Form extends Component { 
    constructor(props) { 
    super(props); 
    this.state = { name: '', email: '' }; 
    } 

    render() { 
    const { name, email } = this.state; 

    return (
     <View> 
     <TextInput 
      onChangeText={name => this.setState({ name })} 
      value={name} 
     /> 
     <TextInput 
      onChangeText={email => this.setState({ email })} 
      value={email} 
     /> 
     <TouchableHighlight disabled={!name || !email}> 
      Submit 
     </TouchableHighlight> 
     </View> 
    ); 
    } 
} 

В принципе, вы сохраняете каждое значение TextInput с в состоянии, и вы переключите disabled опоры в Touchable* (также работает для Button) компоненты, когда все значения заполняются. И здесь вы также можете выполнить некоторую базовую проверку, например длину или соответствующий шаблон.

Смежные вопросы