web-dev-qa-db-fra.com

Passe React ref de parent à l'enfant afin d'obtenir un élément DOM

J'ai un parent et un composant enfant. J'ai besoin d'accéder au parent HTMLelement dans le composant enfant.

J'ai une solution de travail mais malpropre impliquant this.setState({ domNode: ReactDOM.findDOMNode(this) }); dans le parent componentDidMount qui est juste mal à plusieurs niveaux.

Comment puis-je faire cela en utilisant createRef() dans le parent pour transmettre sa référence comme un accessoire à l'enfant, puis comment puis-je obtenir le nœud DOM avec le type HTMLElement de la référence?

9
Spacemoose

La solution de @shubham Khatri doit être mentionnée. La petite correction que je veux montrer, il n'est pas nécessaire d'invoquer une fonction de rappel getElem() de l'enfant au parent pour recevoir la référence du parent. Il peut être adopté directement la référence à l'enfant <Child getParentElem={this.domElem}/> Je vois peu d'utilisateurs se plaindre à recevoir {current: null} à l'enfant. Veuillez vérifier si les composants UI sont livrés par un cadre, comme par ex. Sémantican-UI. Il pourrait probablement y avoir d'autres méthodes pour accrocher une référence à partir d'un composant. En sémantique-ui doit être enveloppé le composant parent de <Ref innerRef={ ... }> ... </Ref>

0
lortschi