Skip to content

Commit 3e31a3a

Browse files
authored
Apply suggestions from code review
Гарна робота!
1 parent 7af51df commit 3e31a3a

1 file changed

Lines changed: 3 additions & 3 deletions

File tree

src/content/reference/react/forwardRef.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ const MyInput = forwardRef(function MyInput(props, ref) {
4242

4343
#### Застереження {/*caveats*/}
4444

45-
* У суворому режимі React **викличе вашу функцію для рендеру двічі**, щоб [допомогти вам знаходити побічні ефекти.](#my-initializer-or-updater-function-runs-twice) Ця поведінка діє лише під час розробки і не впливає на продакшн. Якщо ваша функція для рендеру є чистою (якою вона й має бути), то ця поведінка не вплине на логіку вашого компонента. Результат одного з викликів буде проігноровано.
45+
* У строгому режимі React **викличе вашу функцію для рендеру двічі**, щоб [допомогти вам знаходити побічні ефекти.](#my-initializer-or-updater-function-runs-twice) Ця поведінка діє лише під час розробки і не впливає на продакшн. Якщо ваша функція для рендеру є чистою (якою вона й повинна бути), то ця поведінка не вплине на логіку вашого компонента. Результат одного з викликів буде проігноровано.
4646

4747
---
4848

@@ -132,7 +132,7 @@ function Form() {
132132

133133
Цей компонент `Form` [передає реф](/reference/react/useRef#manipulating-the-dom-with-a-ref) до `MyInput`. Компонент `MyInput` *направляє* той реф до браузерного тегу `<input>`. Як результат, компонент `Form` має доступ до DOM-вузла `<input>` та може викликати [`focus()`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/focus) на ньому.
134134

135-
Пам'ятайте, що розкриття рефу DOM-вузла всередині вашого компонента робить важчою зміну внутрішніх частин компонента пізніше. Зазвичай, ви будете розкривати DOM-вузли з компонентів нижнього рівня, що перевикористовуються, та не будете робити це із глобальними компонентами, такими як аватар чи коментар.
135+
Пам'ятайте, що розкриття рефу DOM-вузла всередині вашого компонента робить важчою зміну внутрішніх частин компонента пізніше. Зазвичай, ви будете розкривати DOM-вузли з компонентів нижнього рівня, що перевикористовуються (як-от кнопки та поля вводу), та не будете робити це із глобальними компонентами, такими як аватар чи коментар.
136136

137137
<Recipes title="Приклади направлення рефу">
138138

@@ -468,7 +468,7 @@ input {
468468
469469
**Не використовуйте рефи занадто часто.** Ви повинні використовувати рефи тільки для *імперативної* поведінки, яку не можете передавати як пропси: для прикладу, скролл до вузла, фокусування на вузлі, активацію анімації, виділення тексту тощо.
470470
471-
**Якщо ви можете передати щось як проп, вам не потрібно використовувати реф.** Для прикладу, замість розкриття імперативного керування `{ open, close }` з компонента `Modal`, краще передати `isOpen` як проп, подібно до `<Modal isOpen={isOpen} />`. [Ефекти](/learn/synchronizing-with-effects) можуть допомогти вам розкрити імперативну поведінку через пропси.
471+
**Якщо ви можете виразити щось як проп, вам не потрібно використовувати реф.** Для прикладу, замість розкриття імперативного керування як `{ open, close }` з компонента `Modal`, краще передати `isOpen` як проп, по типу `<Modal isOpen={isOpen} />`. [Ефекти](/learn/synchronizing-with-effects) можуть допомогти вам розкрити імперативну поведінку через пропси.
472472
473473
</Pitfall>
474474

0 commit comments

Comments
 (0)