1

当未填写用户名/密码字段时，我试图禁用 TouchableOpacity 元素。这没用。它始终处于禁用状态。

我将条件打印!this.state.username || !this.state.password 到控制台，只有当两者都被填充时才为假，这是所需的结果，但 TouchableOpacity 的 disabled 属性似乎并未反映此条件下的值。下面是我的代码片段：

任何人都可以提出解决这个问题的方法吗？

<ScrollView style={styles.content}>
      <View style={[styles.container, styles.content]}>
        <View style={styles.inputContainer}>
          <Image style={styles.inputIcon} source={emailicon}/>
          <TextInput style={[styles.inputs]}
              ref={`username`}
              placeholder="Email"
              keyboardType="email-address"
              underlineColorAndroid='transparent'
              onChangeText={(text) => {this.state.username = text}}
              required={true}
          />
        </View>

        <View style={styles.inputContainer}>
          <Image style={styles.inputIcon} source={keyicon}/>
          <TextInput
              style={styles.inputs}
              ref={`password`}
              placeholder="Password"
              secureTextEntry={true}
              underlineColorAndroid='transparent'
              onChangeText={(text) => {this.state.password = text}}
              required={true}
          />
        </View>

        <TouchableOpacity style={[styles.buttonContainer, styles.loginButton]}
                            onPress={() => { console.log(!this.state.username || !this.state.password) }} disabled={!this.state.username || !this.state.password}>
          <Text style={styles.loginText}>Login</Text>
        </TouchableOpacity>
4

1 回答 1

1

尝试使用 setState 而不是在onChangeText中为此状态赋值。

只需在两个 textInput 中替换这一行

onChangeText={(text) => {this.setState({username:text})}}

和

onChangeText={(text) => {this.setState({password:text})}}
于 2019-04-06T13:57:19.617 回答