禁用本机反应按钮 [英] Disabling buttons on react native

问题描述

我正在使用 react native 制作一个 android 应用，并且我使用了 TouchableOpacity 组件来创建按钮.
我使用文本输入组件来接受来自用户的文本，并且该按钮应该仅在文本输入与某个字符串匹配时才启用.
我可以想出一种方法来做到这一点，即在没有 TouchableOpactiy 包装器的情况下最初呈现按钮，并在输入字符串匹配后使用包装器重新呈现.
但我猜有更好的方法来做到这一点.有人可以帮忙吗?

I'm making an android app using react native and I've used TouchableOpacity component to create buttons.
I use a text input component to accept text from the user and the button should only be enabled once the text input matches a certain string.
I can think of a way to do this by initially rendering the button without the TouchableOpactiy wrapper and re-rendering with the wrapper once the input string matches.
But I'm guessing there is a much better way to do this. Can anyone help?

推荐答案

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

TouchableOpacity extents TouchableWithoutFeedback, so you can just use the disabled property :

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

React Native TouchableWithoutFeedback #disabled 文档

新的 Pressable API 也有一个 disabled 选项:

The new Pressable API has a disabled option too :

<Pressable disable={true}>
  {({ pressed }) => (
    <Text>I'm disabled</Text>
  )}
</Pressable>

这篇关于禁用本机反应按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！