Funktion feuern, wenn es will. Wie soll ich das beheben?

8

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%     
clxxxii 12.12.2016, 17:47
quelle

3 Antworten

7

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).

    
martinarroyo 12.12.2016 17:53
quelle
3

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.

    
Matt Aft 21.12.2016 23:02
quelle
2

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

%Vor%     
Maxwelll 25.12.2016 03:33
quelle