You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Appelez `findDOMNode` pour trouver le nœud DOM associé à une instance de [composant React à base de classe](/reference/react/Component) donnée.
29
+
Appelez `findDOMNode` pour trouver le nœud DOM le plus proche associé à une instance de [composant React à base de classe](/reference/react/Component) donnée.
Ce code plantera parce que désormais, `findDOMNode(this)` trouvera le nœud DOM `<div>` alors qu'il s'attend à un nœud DOM `<input>`. Pour éviter ce genre de problème, utilisez [`createRef`](/reference/react/createRef) pour gérer un nœud DOM spécifique.
169
+
Ce code plantera parce que désormais, car `findDOMNode(this)` trouvera le nœud DOM `<div>` alors qu'il s'attend à un nœud DOM `<input>`. Pour éviter ce genre de problème, utilisez [`createRef`](/reference/react/createRef) pour gérer un nœud DOM spécifique.
170
170
171
171
Dans cet exemple, `findDOMNode` n'est plus utilisé. On utilise plutôt `inputRef = createRef(null)` pour définir un champ d'instance. Pour y lire le nœud DOM, vous pouvez utiliser `this.inputRef.current`. Pour le rattacher au JSX, vous mettez dans votre rendu `<input ref={this.inputRef} />`. Ça connecte le code utilisant le nœud DOM à son JSX :
172
172
@@ -313,7 +313,7 @@ Pour remplacer `findDOMNode` dans cet exemple, les deux composants doivent se co
313
313
1.`AutoSelectingInput` doit déclarer une ref, comme dans [l'exemple précédent](#reading-components-own-dom-node-from-a-ref), et la fournir à `<MyInput>`.
314
314
2.`MyInput` doit être déclaré avec [`forwardRef`](/reference/react/forwardRef) pour prendre cette ref et la transmettre au nœud `<input>`.
315
315
316
-
C'est ce que fait cette version, qui n'a donc plus besoin de `findDOMNode`:
316
+
C'est ce que fait cette version, qui n'a donc plus besoin de `findDOMNode`:
317
317
318
318
<Sandpack>
319
319
@@ -369,7 +369,7 @@ export default MyInput;
369
369
370
370
</Sandpack>
371
371
372
-
Voici à quoi ressemblerait ce code avec des fonctions composants au lieu de classes:
372
+
Voici à quoi ressemblerait ce code avec des fonctions composants au lieu de classes:
0 commit comments