按钮 - 启用和禁用

Question

我使用React Native创建了一个表单，但是我希望在TextInput为空时禁用记录按钮，并且在填充所​​有TextInput时，该按钮将返回启用状态。

我该怎么做？你能给我发个例子吗？

Answer 1

你可以做这样的事情：

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 S IN的每个国家的价值，您切换disabled道具的Touchable*（也适用于Button）组成的，当所有的值被填充。 在这里你也可以做一些基本的验证，如长度或匹配模式。