In React Native, wie kann ich auf Methoden einer Komponente von einer anderen Komponente zugreifen?
Ich versuche auf eine Methode einer React Native-Komponente von einer anderen Komponente zuzugreifen. Es wird durch Requisiten geführt. Leider scheinen die Komponenten ihre Methoden nicht öffentlich bereitzustellen. Wie kann ich auf die Methode zugreifen?
Sehen Sie sich Folgendes an: InsideView enthält this.props.myModal, eine ShowMyModal-Komponente. Es hat jedoch keinen Zugriff auf die .openModal () -Methode.
2 Antworten
Ich denke nicht, dass es eine gute Idee ist, die Komponenten im Zustand zu speichern. Der Status sollte wirklich für die Daten der Komponente und nicht für die Unterkomponenten verwendet werden. Dave's Lösung ist ein guter Ansatz, aber es könnte ein bisschen besser gemacht werden, da es den Zustand von Modal zur Anwendung bewegt (was nicht gut ist, um Probleme zu trennen). Es ist gut, wenn Modal seinen eigenen Status behalten und wissen kann, ob es sichtbar ist oder nicht. Dann können openModal () und closeModal () bei Bedarf zusätzliche Dinge tun (im Gegensatz zur Reaktion auf Änderungen in der Sichtbarkeit von ShowModal). Sie können auch die zusätzlichen _openModal und _closeModal vermeiden, die Boilerplate sind.
Ich denke, es ist am besten, Refs zu verwenden. Refs ist die Standardmethode, um auf andere Komponenten zu verweisen. Siehe hier für weitere Details über Referenzen Ссылка Sie können Refs als Strings verwenden und auf die verweisen Diese Art von Strings ist jedoch etwas hässlich, da globale Namen eingeführt werden, die dem Komponentenansatz von react widersprechen. Sie können Callbacks auch als Refs verwenden, um Ihre internen Komponenten als Felder festzulegen. Es gibt ein schönes und einfaches Beispiel dafür ist die Dokumentation von react: Ссылка . Ich kopiere es hier für den Fall, dass die Dokumentation aktualisiert wird:
%Vor%Was hier passiert - die fragliche Ansicht hat callback ref, die this._root als Backing-Komponente der Ansicht setzt. Dann können Sie an jeder anderen Stelle in der Komponente this._root verwenden, um sich darauf zu beziehen.
In Ihrem Fall könnte es also wie folgt aussehen (beachten Sie, dass Sie diese anonymen Pfeilfunktionen benötigen, statt die Methoden openModal / closeModal zu übergeben, da _modal zum Zeitpunkt des Renderings noch nicht festgelegt ist, können Sie später nur mit dem Befehl anonyme Methoden).
%Vor%Dann kann Ihre ursprüngliche ShowModal-Implementierung so bleiben, wie sie ist - mit ihrem eigenen Status und ihren eigenen Funktionen openModal und showModal.
Tags und Links react-native