From b46caa8a7fea811aa6502a75ddce7b86ec10534b Mon Sep 17 00:00:00 2001 From: Noah Lemen Date: Thu, 25 Apr 2024 13:43:58 -0400 Subject: [PATCH] use 'refs to components' terminology instead of 'DOM refs' --- src/content/reference/react/StrictMode.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/content/reference/react/StrictMode.md b/src/content/reference/react/StrictMode.md index c8d4e05269f..02e3c44dc67 100644 --- a/src/content/reference/react/StrictMode.md +++ b/src/content/reference/react/StrictMode.md @@ -44,7 +44,7 @@ Strict Mode enables the following development-only behaviors: - Your components will [re-render an extra time](#fixing-bugs-found-by-double-rendering-in-development) to find bugs caused by impure rendering. - Your components will [re-run Effects an extra time](#fixing-bugs-found-by-re-running-effects-in-development) to find bugs caused by missing Effect cleanup. -- Your components will [detach and re-attach DOM refs](#fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development) to find bugs caused by missing DOM ref cleanup. +- Your components will [detach and re-attach refs to components](#fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development) to find bugs caused by missing ref cleanup. - Your components will [be checked for usage of deprecated APIs.](#fixing-deprecation-warnings-enabled-by-strict-mode) #### Props {/*props*/} @@ -88,7 +88,7 @@ Strict Mode enables the following checks in development: - Your components will [re-render an extra time](#fixing-bugs-found-by-double-rendering-in-development) to find bugs caused by impure rendering. - Your components will [re-run Effects an extra time](#fixing-bugs-found-by-re-running-effects-in-development) to find bugs caused by missing Effect cleanup. -- Your components will [detach and re-attach DOM refs](#fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development) to find bugs caused by missing DOM ref cleanup. +- Your components will [detach and re-attach refs to components](#fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development) to find bugs caused by missing ref cleanup. - Your components will [be checked for usage of deprecated APIs.](#fixing-deprecation-warnings-enabled-by-strict-mode) **All of these checks are development-only and do not impact the production build.** @@ -827,16 +827,16 @@ Without Strict Mode, it was easy to miss that your Effect needed cleanup. By run [Read more about implementing Effect cleanup.](/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development) --- -### Fixing bugs found by detaching and re-attaching DOM refs in development {/*fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development*/} +### Fixing bugs found by detaching and re-attaching refs to components in development {/*fixing-bugs-found-by-cleaning-up-and-re-attaching-dom-refs-in-development*/} -In canary and experimental channels, React will run an extra setup+cleanup cycle in development for DOM refs, much like it does for Effects. +In canary and experimental channels, React will run an extra setup+cleanup cycle in development for refs to components, much like it does for Effects. -React will detach DOM refs that were created via `useRef` by setting `ref.current` to `null` before setting it back to the DOM node. +React will detach refs to components that were created via `useRef` by setting `ref.current` to `null` before setting it to the DOM node or handle. -For [`ref` callbacks](/reference/react-dom/components/common#ref-callback), React will call the callback function with the DOM node as its argument. It will then call the callback's [cleanup function](reference/react-dom/components/common#returns) before calling the `ref` callback function again with the DOM node as its argument. +For [`ref` callbacks](/reference/react-dom/components/common#ref-callback), React will call the callback function with the DOM node or handle as its argument. It will then call the callback's [cleanup function](reference/react-dom/components/common#returns) before calling the `ref` callback function again with the DOM node as its argument. -You can read more about DOM refs in [Manipulating the DOM with Refs.](/learn/manipulating-the-dom-with-refs) +You can read more about refs in [Manipulating the DOM with Refs.](/learn/manipulating-the-dom-with-refs) ---