按下

Question

当TouchableHighlight的孩子具有不透明度时，在按下TouchableHighlight后，其不透明度会消失（设置为1）。

在此处运行示例：https://rnplay.org/apps/c0NIjQ

最小例子：

<TouchableHighlight onPress={() => {}}>
    <Text style={{ opacity: 0.5 }}>
        Press me!
    </Text>
</TouchableHighlight>

有没有办法修复它，或者它是React Native中的错误？

Answer 1

TouchableOpacity正如我对TouchableHighlight（live code sample）所期望的那样，因此使用TouchableOpacity可能是一种解决方法。但是，注意，TouchableOpacity没有在活动时出现的参考底图，因此无论你在下面渲染什么，都会在按下时“闪耀”。因此，它不是TouchableHighlight的完美替代品。

我不确定TouchableHighlight的行为是否有意，某种权衡或实际上是一个错误，但是看一下代码，你可以清楚地看到它与TouchableOpacity在这方面的区别：

• TouchableHighlight always sets the child's opacity to 1 when it goes inactive.
• TouchableOpacity sets the child's opacity to childStyles.opacity if it is set, otherwise 1, when it goes inactive.

Answer 2

您可以通过实施onPressOut的{​​{1}}方法并将不透明度绑定到州属性来解决此问题。

TouchableHighlight

不太理想我同意。