Conversation
Size changesDetails📦 Next.js Bundle Analysis for react-devThis analysis was generated by the Next.js Bundle Analysis action. 🤖 This PR introduced no changes to the JavaScript bundle! 🙌 |
| #### Значэнні, якія вяртаюцца {/*returns*/} | ||
|
|
||
| `useId` returns a unique ID string associated with this particular `useId` call in this particular component. | ||
| `useId` вяртае радок з унікальным ідэнтыфікатарам, які праасацыяваны з гэтым канкрэтным выклікам `useId` у гэтым канкрэтным кампаненце. |
There was a problem hiding this comment.
які праасацыяваны
Можа лепш будзе замяніць на "які звязаны з"?
| * `useId` **should not be used to generate keys** in a list. [Keys should be generated from your data.](/learn/rendering-lists#where-to-get-your-key) | ||
|
|
||
| * `useId` currently cannot be used in [async Server Components](/reference/rsc/server-components#async-components-with-server-components). | ||
| - `useId` — хук, а значыць, вы можаце яго выклікаць толькі **на верхнім узроўні вашага кампанента** ці ўнутры ўласнага хука. Ëн не можа быць выкліканы ўнутры цыкла альбо ўмовы. Калі вы гэтага патрабуеце, выміце ў новы кампанент і перанясіце стан туды. |
There was a problem hiding this comment.
вы можаце яго выклікаць ..
Стылістычная заўвага: "вы можаце выклікаць яго ..."
There was a problem hiding this comment.
Калі вы гэтага патрабуеце, выміце ў новы кампанент і перанясіце стан туды.
Калі вам усё ж гэта патрэбна, то стварыце новы кампанент і перанясіце стан туды.
|
|
||
| * `useId` currently cannot be used in [async Server Components](/reference/rsc/server-components#async-components-with-server-components). | ||
| - `useId` — хук, а значыць, вы можаце яго выклікаць толькі **на верхнім узроўні вашага кампанента** ці ўнутры ўласнага хука. Ëн не можа быць выкліканы ўнутры цыкла альбо ўмовы. Калі вы гэтага патрабуеце, выміце ў новы кампанент і перанясіце стан туды. | ||
| - `useId` **не мусіць быць выкарыстаны для генерацыі ключоў кэша** для [use()](/reference/react/use). Ідэнтыфікатар стабільны пакуль кампанент прымантаваны, але можа змяняцца паміж рэндарамі. Ключы кэша мусяць быць згенераванымі на падставе вашых даных. |
There was a problem hiding this comment.
не мусіць быць выкарыстаны
не мусіць выкарыстоўвацца?
There was a problem hiding this comment.
Ідэнтыфікатар стабільны пакуль кампанент прымантаваны, але можа змяняцца паміж рэндарамі.
Ідэя паляпшэння:
Ідэнтыфікатар стабільны пры манціраванні кампанента, але можа змяніцца падчас рэндарынгу.
There was a problem hiding this comment.
Ключы кэша мусяць быць згенераванымі на падставе вашых даных.
Ключы кэша мусяць генерыравацца на падставе вашых даных.
| * `useId` currently cannot be used in [async Server Components](/reference/rsc/server-components#async-components-with-server-components). | ||
| - `useId` — хук, а значыць, вы можаце яго выклікаць толькі **на верхнім узроўні вашага кампанента** ці ўнутры ўласнага хука. Ëн не можа быць выкліканы ўнутры цыкла альбо ўмовы. Калі вы гэтага патрабуеце, выміце ў новы кампанент і перанясіце стан туды. | ||
| - `useId` **не мусіць быць выкарыстаны для генерацыі ключоў кэша** для [use()](/reference/react/use). Ідэнтыфікатар стабільны пакуль кампанент прымантаваны, але можа змяняцца паміж рэндарамі. Ключы кэша мусяць быць згенераванымі на падставе вашых даных. | ||
| - `useId` **не мусіць быць выкарыстаны для генерацыі ключоў** у спісах. [Ключы мусяць быць згенераванымі на падставе вашых даных](/learn/rendering-lists#where-to-get-your-key). |
There was a problem hiding this comment.
не мусіць быць выкарыстаны
не мусіць выкарыстоўвацца
There was a problem hiding this comment.
Ключы мусяць быць згенераванымі на падставе вашых даных
Ключы мусяць генерыравацца на падставе вашых даных.
| <Pitfall> | ||
|
|
||
| **Do not call `useId` to generate keys in a list.** [Keys should be generated from your data.](/learn/rendering-lists#where-to-get-your-key) | ||
| **Не выкарыстоўвайце `useId` для генерацыі ключоў у спісах.** [Ключы мусяць быць згенераванымі на падставе вашых даных](/learn/rendering-lists#where-to-get-your-key). |
There was a problem hiding this comment.
Ключы мусяць быць згенераванымі на падставе вашых даных
Ключы мусяць генерыравацца на падставе вашых даных.
| <Pitfall> | ||
|
|
||
| With [server rendering](/reference/react-dom/server), **`useId` requires an identical component tree on the server and the client**. If the trees you render on the server and the client don't match exactly, the generated IDs won't match. | ||
| Пры [серверным рэндарынгу](/reference/react-dom/server), **`useId` патрабуе ідэнтычнага дрэва кампанентаў на серверы і на кліенце**. Калі дрэвы, што вы рэндарыце і кліенце і серверы не суадносяцца, згенераваныя ідэнтыфікатары будуць адрознымі. |
There was a problem hiding this comment.
вы рэндарыце і кліенце і серверы не суадносяцца
вы рэндарыце НА кліенце і серверы не супадаюць
| <DeepDive> | ||
|
|
||
| #### Why is useId better than an incrementing counter? {/*why-is-useid-better-than-an-incrementing-counter*/} | ||
| #### Чым useId лепей за нарастальнага лічыльнік? {/*why-is-useid-better-than-an-incrementing-counter*/} |
There was a problem hiding this comment.
Чым useId лепей за інкрэментальны лічыльнік?
А можа лепш Чаму?
| #### Чым useId лепей за нарастальнага лічыльнік? {/*why-is-useid-better-than-an-incrementing-counter*/} | ||
|
|
||
| You might be wondering why `useId` is better than incrementing a global variable like `nextId++`. | ||
| Вы можаце задумацца: чым `useId` лепей за нарастальную глабальную пераменную накшталт `nextId++`. |
There was a problem hiding this comment.
за інкрэментальную глабальную пераменную
| Асноўная перавага `useId` у тым, што React забяспечваю працу пры [серверным рэндарынгу](/reference/react-dom/server). Падчас сервернага рэндарынгу, з вашых кампанентаў генеруецца HTML. Потым, на кліенце, падчас [гідратацыі](/reference/react-dom/client/hydrateRoot) адбываецца прывязка апрацоўшчыкаў падзей да згенераванага HTML. Каб гідратацыя спрацавала, вынік кліента мусіць супадаць з HTML сервера. | ||
|
|
||
| This is very difficult to guarantee with an incrementing counter because the order in which the Client Components are hydrated may not match the order in which the server HTML was emitted. By calling `useId`, you ensure that hydration will work, and the output will match between the server and the client. | ||
| Гэта вельмі складана гарантаваць праз нарастальны лічыльнік, бо парадак, у якім кліент робіць гідратацыю кампанентаў, можа не адпавядаць парадку, у якім сервер складае HTML. Карыстаючыся `useId`, можна гарантаваць, што гідрадацыя спрацуе, і вынік будзе аднолькавым на серверы і кліенце. |
There was a problem hiding this comment.
нарастальны лічыльнік
інкрэментальны лічыльнік
| Гэта вельмі складана гарантаваць праз нарастальны лічыльнік, бо парадак, у якім кліент робіць гідратацыю кампанентаў, можа не адпавядаць парадку, у якім сервер складае HTML. Карыстаючыся `useId`, можна гарантаваць, што гідрадацыя спрацуе, і вынік будзе аднолькавым на серверы і кліенце. | ||
|
|
||
| Inside React, `useId` is generated from the "parent path" of the calling component. This is why, if the client and the server tree are the same, the "parent path" will match up regardless of rendering order. | ||
| Унутры React, `useId` генеруецца на падставе размяшчэння бацькоўскага кампанента». Менавіта таму, калі дрэвы кліента і сервера ідэнтычныя, «размяшчэнне бацькоўскага кампанента» будзе адпавядаць незалежна ад парадку рэндара. |
There was a problem hiding this comment.
будзе адпавядаць незалежна ад парадку рэндара.
будзе супадаць незалежна ад парадку рэндару.
No description provided.