Skip to content

Translate/use layout effect #961

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
titovmx merged 6 commits into from
Jul 21, 2024
Merged

Translate/use layout effect #961

Changes from 1 commit
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
b892ca0
added translations for useLayoutEffect
Jul 5, 2024
fdef1ef
some fixes
Jul 6, 2024
788b7ec
Update src/content/reference/react/useLayoutEffect.md
nocode13 Jul 20, 2024
22cec09
Update src/content/reference/react/useLayoutEffect.md
nocode13 Jul 20, 2024
b1bef58
Update src/content/reference/react/useLayoutEffect.md
nocode13 Jul 20, 2024
abffd01
Update src/content/reference/react/useLayoutEffect.md
nocode13 Jul 20, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Update src/content/reference/react/useLayoutEffect.md 
made more clear

Co-authored-by: Maxim Titov <mtitov92@gmail.com>
  • Loading branch information
@nocode13 @titovmx
nocode13 and titovmx authored Jul 20, 2024
commit abffd01b3abcde92c8baf5db5014257d3be761b6
2 changes: 1 addition & 1 deletion src/content/reference/react/useLayoutEffect.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -736,4 +736,4 @@ export default function TooltipContainer({ children, x, y, contentRef }) {

- Или же можно рендерить компонент с использованием `useLayoutEffect` только после гидрации. Создайте состояние `isMounted` , инициализируемое значением `false`, и установите его в `true` внутри вызова `useEffect`. Ваша логика рендеринга может выглядеть следующим образом: `return isMounted ? <RealContent /> : <FallbackContent />`. На сервере и во время гидрации пользователь увидит `FallbackContent`, который не должен вызывать `useLayoutEffect`. Затем React заменит его на `RealContent` , который выполняется только на клиенте и может включать вызовы `useLayoutEffect`.

- Если ваш компонент синхронизируется с внешним хранилищем данных и используете `useLayoutEffect` не только для измерения макета, рассмотрите вариант использования [`useSyncExternalStore`](/reference/react/useSyncExternalStore). Этот хук [поддерживает серверный рендеринг.](/reference/react/useSyncExternalStore#adding-support-for-server-rendering)
- Если ваш компонент синхронизируется с внешним хранилищем данных, и вы используете `useLayoutEffect` не только для измерения макета, рассмотрите вариант использования [`useSyncExternalStore`](/reference/react/useSyncExternalStore). Этот хук [поддерживает серверный рендеринг.](/reference/react/useSyncExternalStore#adding-support-for-server-rendering)