J'ai du mal à trouver une solution à mon problème, mais je ne la trouve nulle part. Ma question est donc de savoir comment appeler une fonction parent à partir d'un enfant. La fonction doit être passée dans un onPress = {()} à l'intérieur de l'enfant
Parent.js
<Avatar avatarStyle={{ height: 50 }} onPress={() => { this.onPressAvatar() }} source={require('../../assets/images/dav-r.jpeg')} /> onPressAvatar = () => { console.log('press on avatar'); this.props.callParent.bind(this)Child.js
constructor(props) { super(props); this.state = { loading: true }; this.state = { active: 'active' }; this.openDrawer = this.openDrawerButtonFunction.bind(this); this.callParent = this.callParent.bind(this) } callParent = () => { console.log('I am your father') }
}
3 Réponses :
Vous devez passer la fonction parent comme accessoire à l'enfant. Plus d'informations ici
Dans la fonction de rendu parent
callparentfunction(){ this.props.functiontoPass('Hello from the child') }
Dans l'enfant
parentfunction(info){ alert(info) } render(){ return( //bla bla bla <Child functionToPass={this.parentfunction}/> //bla bla bla ) }
p>
C'est un malentendu courant, vous êtes donc entre de bonnes mains.
Vous allez utiliser des Props
pour accomplir l'appel d'une fonction parent à un enfant.
Naturellement, l'enfant ne connaît pas les fonctions du parent. Lorsque vous avez besoin de faire quelque chose dans le composant enfant, et de le faire remonter à la fonction parent, il vous suffit de passer la fonction comme accessoire.
Exemple < / / / pre> XXX Lorsque vous exécutez la fonction someFunctionInChildComponent ()
, elle appellera le Prop
appelé functionPropNameHere
qui se déplace ensuite au composant parent pour y appeler la fonction. L'entrée x
sera espace réservé pour x
dans cet exemple.
Oui, vous avez répondu à ma question. Salut mon pote!
c'est une conception horrible de la part du natif de réaction! Cela n'aide pas vraiment lorsque vous avez des applications complexes telles que des écrans contenant des composants et fournissant également diverses fonctions utilitaires pour les fenêtres contextuelles, etc.
Veuillez montrer votre code complet, la partie dans laquelle vous incluez le composant enfant dans votre composant parent.