有没有一种方法，我可以忽略触摸事件的文本在反应本机？

我想实现浮动标签，为此我有一个以上的 Text的 TextInput组件。我想忽略所有的触摸事件上的 Text，以便它下面的 TextInput得到所有的事件。我能做到吗？在 CSS 中，我们曾经有 pointer-events: none，我不知道如何做到这一点在反应本机。

react-native

72839 次浏览

小开

Add pointerEvents: 'none' to the Text component. This allows touch events to go to the ancestors of the component, but not the component itself or its children.

React Native also supports 'box-none', which allows touch events to go to the ancestors and children of the component, and excludes only the component itself.

小开

In react-native, pointerEvents is a prop, not a style.

<View pointerEvents="none" />

小开

I had the same problem as Cryszon. On Android is seems like pointerEvents="none" doesn't work for Text components.

Wrapping the Text in a View and putting the pointerEvents="none" prop there solved it.

小开

pointerEvents work only on View not on Text or TouchableOpacity.

小开

If you have an issue where even 'box-none' doesn't allow touch events to go to the children, you could do something like this

let setPointerEvents = 'none';
...
<View pointerEvents={setPointerEvents}>
...
<TouchableOpacity onPress= {()=>this.set(false)}/>


</View>
<TouchableOpacity onPress= {()=>this.set(true)}/>
...
set(bool){
switch(bool){
case true:
setPointerEvents= 'auto'
break;
case false:
setPointerEvents= 'none'
break;
}
}

Kind of a hack, but it works.