禁用按钮on native native

Question

我正在使用本机做一个Android应用程序,我使用了TouchableOpacity组件来创建按钮.
我使用文本输入组件来接受来自用户的文本,并且只有在文本输入与特定字符串匹配时才应启用该按钮.
我可以通过最初渲染没有TouchableOpactiy包装器的按钮并在输入字符串匹配时使用包装器重新渲染来想办法.
但我猜测有更好的方法可以做到这一点.有人可以帮忙吗？

Answer 1

TouchableOpacity范围TouchableWithoutFeedback,所以你可以使用disabled属性:

<TouchableOpacity disabled={true}>
  <Text>I'm disabled</Text>
</TouchableOpacity>

React Native TouchableWithoutFeedback #disabled文档

Answer 2

就这样做吧

<TouchableOpacity activeOpacity={disabled ? 1 : 0.7} onPress={!disabled && onPress}>
  <View>
    <Text>{text}</Text>
  </View>
</TouchableOpacity>

Answer 3

这个原生库有解决方案：

<Button
    block
    disabled={!learnedWordsByUser.length}
    style={{ marginTop: 10 }}
    onPress={learnedWordsByUser.length && () => {
      onFlipCardsGenerateNewWords(learnedWordsByUser)
      onFlipCardsBtnPress()
    }}
>
    <Text>Let's Review</Text>
</Button>

Answer 4

所以很容易禁用 React Native 中的任何按钮

<TouchableOpacity disabled={true}>
    <Text> 
          This is disabled button
   </Text>
</TouchableOpacity>

禁用是反应本机中的一个道具，当您将其值设置为“true”时，它将禁用您的按钮

快乐烹饪