有没有一种方法可以忽略React Native中Text上的触摸事件？

我想实现浮动标签，为此，我在TextInput上方有一个Text组件。我想忽略Text上的所有触摸事件，以便它下面的TextInput获取所有事件。有办法吗？在CSS中，过去我们没有指针事件，我不确定如何在react native中做到这一点。

react-native

— 玛雅克·帕特尔（Mayank Patel）
source

向我们展示您到目前为止所拥有的将很有帮助。

— 瑞安·史密斯

我正在尝试构建类似codepen.io/soulrider911/pen/ugnyl的

— Mayank Patel，

如果有人在常规React（不是React Native）中寻找解决方案，则可以简单地将css设置pointer-events: none为您希望点击通过的元素。

— protovangelion

Answers:

163

在react-native中，pointerEvents是prop而不是style。

    <View pointerEvents="none" />

— 吉尔·伯曼
source

如果这样设置，似乎可以正常工作 <View pointerEvents={'none'} />

— pnizzle '18

在某些情况下，您可能希望子视图仍然是触摸的目标，因此，pointerEvents = {'box-none'}将是合适的解决方案：facebook.github.io/react-native/docs/view.html#pointerevents

— RaphArbuz

非常感谢！

— Bruno de Sales

添加pointerEvents: 'none'到Text组件。这允许触摸事件传递到组件的祖先，而不是组件本身或其子代。

React Native还支持'box-none'，它允许触摸事件传递到组件的祖先和子代，并且仅排除组件本身。

— ide
source

由于某种原因，我无法使其在Text组件上工作，但是将其包装Text在a中View并将pointerEvents="none"支柱放置在其中即可解决该问题。

— Cryszon

我和克里斯松有同样的问题。在Android上，pointerEvents =“ none”似乎不适用于Text组件。

将文本包装在视图中，然后将pointerEvents =“ none”道具放置在其中即可解决该问题。

— 杰克·考克森
source

pointerEvents仅在View上不支持Text或TouchableOpacity

— 萨凯特（Saikat Saha）
source

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.

Licensed under cc by-sa 3.0 with attribution required.