Ich habe dieses Video in zindex: -1 mit einer Taste und einem Texteingang, der darüber schwebt. Das Problem ist, wenn sich der Text ändert, soll er dieses Statusobjekt manipulieren und nicht die Klickfunktion des berührbaren Highlights auslösen.
Wenn ich den gestern gegebenen Vorschlag verwende, wird der Fehler zur Warnung. Wenn ich 7 zufällige Buchstaben in das Eingabefeld eintippe, erhalte ich 7 Warnungen, die sagen: "warning bind () Sie binden eine Komponentenmethode an die Komponente", was bedeutet, dass das Eingabefeld weiterhin die Funktion des berührbaren Hervorhebungselements aufruft / p>
Ich benutze diese Bibliothek für React Native, um ihre Streaming-Fähigkeiten zu nutzen: Ссылка . Es ist ziemlich nett!
In einem der Beispiele Ссылка gibt es diese Codezeilen, an denen ich herumfummle mit:
%Vor%Wenn ich Text in das Textfeld eintrage, feuert die Funktion this._textRoomPress (), die in TouchableHighlight verschachtelt ist. Was!? Wenn ich es auszeichne, feuert es nicht.
%Vor% Ersetzen Sie es durch this._textRoomPress.bind(this)
Es wird nicht willkürlich ausgelöst, es wird jedes Mal ausgelöst, wenn ein Render ausgegeben wird. Das passiert, weil alles, was Sie an ein Objekt als Requisite übergeben, vor dem Übergeben ausgewertet wird (wie die Parameter einer Funktion im Grunde sind), und was Sie also übergeben, ist der Rückgabewert der Funktion, was Sie natürlich nicht tun wollen. Durch Übergeben von this._textRoomPress
(mit dem optionalen bind
für den Fall, dass Sie den Kontext des Objekts beibehalten möchten) übergeben Sie einen Verweis auf die Funktion, die später von der Komponente zur entsprechenden Zeit (wenn das Element ist) aufgerufen wird gedrückt).
Da Sie createClass und nicht die es6-Syntax verwenden, sind alle Methoden bereits autobindend für die Komponente. Ändere einfach dein onPress zu:
%Vor% Wenn Sie onPress={this._textRoomPress()}>
verwenden, wird diese Funktion sofort aufgerufen, wenn Ihre Komponente gerendert wird.
In Javascript verwenden Sie <function name>()
, um eine Funktion aufzurufen ... Was Sie hier tun, ist, diese Funktion einfach jedes Mal aufzurufen, wenn _renderTextRoom()
aufgerufen wird, anstatt sie dem onPress-Prop zuzuweisen. Was ich vorschlagen würde, ist, dass Sie eine anonyme Funktion als Requisite übergeben (ohne sie aufzurufen), die dann den Aufruf von this._textRoomPress
zurückgibt. ES6-Pfeil-Funktionen machen das superleicht, weil sie nicht ihr eigenes this
mehr binden Infos hier
Tags und Links javascript react-native reactjs ecmascript-6 ecmascript-7