Gibt es eine Möglichkeit, Berührungsereignisse für Text in React Native zu ignorieren?

73

Ich möchte schwebende Beschriftungen implementieren, dafür habe ich eine Textkomponente über einem TextInput. Ich möchte alle Berührungsereignisse im Text ignorieren, damit der TextInput darunter alle Ereignisse erhält. Gibt es eine Möglichkeit, dies zu tun? In CSS hatten wir früher keine Zeigerereignisse. Ich bin mir nicht sicher, wie ich das in React Native machen soll.

react-native

— Mayank Patel
quelle

Es wäre hilfreich, uns zu zeigen, was Sie bisher haben.

— Rian Schmits

Ich versuche so etwas wie codepen.io/soulrider911/pen/ugnyl

— Mayank Patel

Wenn jemand nach der Lösung in normalem React sucht ( nicht in React Native ), können Sie einfach das CSS pointer-events: nonefür das Element festlegen, durch das die Klicks geleitet werden sollen.

— ProtoEvangelion

159

In React-Native pointerEventsist eine Requisite , kein Stil.

    <View pointerEvents="none" />

— Gil Birman
quelle

2

scheint zu funktionieren, wenn es so eingestellt ist <View pointerEvents={'none'} />

— pnizzle

7

In einigen Fällen möchten Sie möglicherweise, dass die Unteransichten weiterhin das Ziel von Berührungen sind, sodass pointerEvents = {'box-none'} die geeignete Lösung ist: facebook.github.io/react-native/docs/view.html#pointerevents

— RaphArbuz

ICH DANKE DIR SEHR!

— Bruno de Sales

42

In pointerEvents: 'none'auf die TextKomponente. Auf diese Weise können Berührungsereignisse an die Vorfahren der Komponente gesendet werden, nicht jedoch an die Komponente selbst oder ihre untergeordneten Komponenten.

React Native unterstützt auch 'box-none', wodurch Berührungsereignisse an die Vorfahren und untergeordneten Elemente der Komponente gesendet werden können, und schließt nur die Komponente selbst aus.

— ide
quelle

13

Aus irgendeinem Grund konnte ich es nicht dazu bringen, an einer TextKomponente zu arbeiten, aber das Einwickeln Textin eine Viewund das Platzieren der pointerEvents="none"Requisite löste es.

— Cryszon

29

Ich hatte das gleiche Problem wie Cryszon. Unter Android scheint pointerEvents = "none" für Textkomponenten nicht zu funktionieren.

Das Umschließen des Textes in eine Ansicht und das Platzieren der Stütze pointerEvents = "none" löste das Problem.

— Jake Coxon
quelle

0

pointerEvents funktionieren nur in der Ansicht, nicht in Text oder TouchableOpacity

— Saikat Saha
quelle