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
Copy file name to clipboardExpand all lines: src/content/reference/react/useLayoutEffect.md
+3-3Lines changed: 3 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -47,7 +47,7 @@ function Tooltip() {
47
47
48
48
#### Параметры {/*parameters*/}
49
49
50
-
* `setup`: Функция с логикой вашего эффекта. Ваша setup-функция, опционально, может возвращать функцию очистки. Перед тем, как ваш компонент добавится в DOM, React запустит вашу setup-функцию. После каждого повторного рендера с изменёнными зависимостями, React запустит функцию очистки (если вы её предоставили) со старыми значениями, а затем запустит вашу setup-функцию с новыми значениями. Перед тем как ваш компонент удалится из DOM, React запустит функцию очистки.
50
+
* `setup`: Функция с логикой вашего эффекта. Ваша setup-функция, опционально, может возвращать функцию *очистки*. Перед тем, как ваш компонент добавится в DOM, React запустит вашу setup-функцию. После каждого повторного рендера с изменёнными зависимостями, React запустит функцию очистки (если вы её предоставили) со старыми значениями, а затем запустит вашу setup-функцию с новыми значениями. Перед тем как ваш компонент удалится из DOM, React запустит функцию очистки.
51
51
52
52
* `dependencies`: Список всех реактивных значений, на которые ссылается код функции `setup`. К реактивным значениям относятся пропсы, состояние, а также все переменные и функции, объявленные непосредственно в теле компонента. Если ваш линтер [настроен для использования с React](/learn/editor-setup#linting), он проверит, что каждое реактивное значение правильно указано как зависимость. Список зависимостей должен иметь постоянное количество элементов и быть записан примерно так: `[dep1, dep2, dep3]`. React будет сравнивать каждую зависимость с предыдущим значением, используя алгоритм сравнения [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is). Если не указать зависимости вообще, то эффект будет запускаться заново после каждого повторного рендера компонента.
53
53
@@ -59,7 +59,7 @@ function Tooltip() {
59
59
60
60
* `useLayoutEffect` это хук, поэтому вы можете вызывать его только **на верхнем уровне вашего компонента** или собственных хуков. Вы не можете вызывать его внутри циклов или условий. Если вам это нужно, выделите компонент и перенесите эффект туда.
61
61
62
-
* Когда включен строгий режим (Strict Mode), React **выполнит один дополнительный цикл инициализации и очистки предназначенный только для разработки**, перед первой реальной инициализаций. Это стресс-тест, который гарантирует, что ваша логика очистки "зеркально отражает" вашу логику инициализации и что она останавливает или отменяет все, что делает инициализация. Если это вызывает проблему, [реализуйте функцию очистки.](/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development)
62
+
* Когда включен строгий режим (Strict Mode), React **выполнит один дополнительный цикл инициализации и сброса предназначенный только для разработки**, перед первой реальной инициализаций. Это стресс-тест, который гарантирует, что ваша логика сброса "зеркально отражает" вашу логику инициализации и что она останавливает или отменяет все, что делает инициализация. Если это вызывает проблему, [реализуйте функцию сброса.](/learn/synchronizing-with-effects#how-to-handle-the-effect-firing-twice-in-development)
63
63
64
64
* Если некоторые из ваших зависимостей являются объектами или функциями, определенными внутри компонента, существует риск, что они будут **вызывать повторное выполнение эффекта чаще, чем необходимо.** Чтобы исправить это, удалите ненужные зависимости от [объектов](/reference/react/useEffect#removing-unnecessary-object-dependencies) и [функций](/reference/react/useEffect#removing-unnecessary-function-dependencies). Вы также можете [вынести обновления состояния](/reference/react/useEffect#updating-state-based-on-previous-state-from-an-effect) и [не реактивную логику](/reference/react/useEffect#reading-the-latest-props-and-state-from-an-effect) за пределы вашего эффекта.
65
65
@@ -404,7 +404,7 @@ export default function TooltipContainer({ children, x, y, contentRef }) {
404
404
405
405
#### `useEffect` не блокирует браузер от перерисовки. {/*useeffect-does-not-block-the-browser*/}
406
406
407
-
Вот тот же пример, но с использованием [`useEffect`](/reference/react/useEffect) вместо `useLayoutEffect`. . Если вы на более медленном устройстве, вы можете заметить, что иногда всплывающая подсказка "мерцает", и вы на мгновение видите её начальную позицию перед корректировкой.
407
+
Вот тот же пример, но с использованием [`useEffect`](/reference/react/useEffect) вместо `useLayoutEffect`. Если вы на более медленном устройстве, вы можете заметить, что иногда всплывающая подсказка "мерцает", и вы на мгновение видите её начальную позицию перед корректировкой.
0 commit comments