69 votes

composantDidMount appelé AVANT le rappel en retour

Problème

Je suis une réagir ref à l'aide d'une fonction inline définition

render = () => {
    return (
        <div className="drawer" ref={drawer => this.drawerRef = drawer}>

puis, en componentDidMount DOM de référence n'est pas définie

componentDidMount = () => {
    // this.drawerRef is not defined

Ma compréhension est l' ref de rappel doit être exécuté lors d'un montage, cependant l'ajout d' console.log des déclarations révèle componentDidMount est appelé avant la ref fonction de rappel.

D'autres exemples de code que j'ai regardé, par exemple cette discussion sur github indiquent la même hypothèse, componentDidMount doit être appelée après tout ref rappels définie en render, c'est même indiqué dans la conversation

Donc componentDidMount est tiré après toutes les ref des rappels ont été exécuté?

Oui.

Je suis l'aide de réagir 15.4.1

Autre chose que j'ai essayé

Pour vérifier l' ref fonction a été appelée, j'ai essayé de le définir sur la classe en tant que telle

setDrawerRef = (drawer) => {
  this.drawerRef = drawer;
}

puis, en render

<div className="drawer" ref={this.setDrawerRef}>

Journalisation de la Console dans ce cas révèle le rappel est en effet appelée après l' componentDidMount

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by: