Skip to content

Commit

Permalink
fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
bielarusajed committed Oct 14, 2023
1 parent 7ee2561 commit 8f23b4f
Showing 1 changed file with 14 additions and 14 deletions.
28 changes: 14 additions & 14 deletions src/content/reference/react/useDebugValue.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ title: useDebugValue

<Intro>

`useDebugValue` — Хук React, які дазваляе дадаць цэтлік да ўласнага хука ў [React DevTools.](/learn/react-developer-tools)
`useDebugValue` — хук React, які дазваляе дадаць пазнаку да ўласнага хука ў [React DevTools.](/learn/react-developer-tools)

```js
useDebugValue(value, format?)
Expand All @@ -20,7 +20,7 @@ useDebugValue(value, format?)
### `useDebugValue(value, format?)` {/*usedebugvalue*/}
Выклічце `useDebugValue` на верхнім узроўні вашага [ўласнага хука](/learn/reusing-logic-with-custom-hooks) каб адабразіць прыдатнае да чытання значэнне:
Выклічце `useDebugValue` на верхнім узроўні вашага [ўласнага хука](/learn/reusing-logic-with-custom-hooks) каб паказаць прыдатнае да чытання значэнне:
```js
import { useDebugValue } from 'react';
Expand All @@ -37,17 +37,17 @@ function useOnlineStatus() {
#### Параметры {/*parameters*/}
* `value` — значэнне, якое вы хочаце паказваць у React DevTools. Яно можа мець любы тып.
* **(неабавязковае)** `format` — функцыя фарматавання. Пры даследванні элемента, React DevTools выкліча функцыю фарматавання, перадаўшы ў яе `value` у якасці аргумента, і пакажа адфарматаванае значэнне, якое верне функцыя (яна прымае значэнне любога тыпу). Калі не задаваць функцыю фарматавання, будзе паказане арыгінальнае значэнне `value`.
* **(неабавязковае)** `format` — функцыя фармаціравання. Пры даследаванні элемента, React DevTools выкліча функцыю фармаціравання, перадаўшы ў яе `value` у якасці аргумента, і пакажа адфармаціраванае значэнне, якое верне функцыя (яна прымае значэнне любога тыпу). Калі не задаваць функцыю фармаціравання, будзе паказана арыгінальнае значэнне `value`.
#### Вяртае {/*returns*/}
`useDebugValue` не вяртае нічога.
`useDebugValue` нічога не вяртае.
## Выкарыстанне {/*usage*/}
### Дадаванне цэтліка да ўласнага хука {/*adding-a-label-to-a-custom-hook*/}
### Дадаванне пазнакі да ўласнага хука {/*adding-a-label-to-a-custom-hook*/}
Выклічце `useDebugValue` на верхнім узроўні вашага [ўласнагахука](/learn/reusing-logic-with-custom-hooks) каб адабразіць прыдатнае да чытання <CodeStep step={1}>значэнне для адладкі</CodeStep> для [React DevTools](/learn/react-developer-tools).
Выклічце `useDebugValue` на верхнім узроўні вашага [ўласнага хука](/learn/reusing-logic-with-custom-hooks) каб паказаць прыдатнае да чытання <CodeStep step={1}>значэнне для адладкі</CodeStep> для [React DevTools](/learn/react-developer-tools).
```js [[1, 5, "isOnline ? 'Online' : 'Offline'"]]
import { useDebugValue } from 'react';
Expand All @@ -59,11 +59,11 @@ function useOnlineStatus() {
}
```
Гэта задасць кампаненту, які выклікае `useOnlineStatus` цэтлік `OnlineStatus: "Online"` пры даследванні яго:
Гэта задасць кампаненту, які выклікае `useOnlineStatus`, пазнаку `OnlineStatus: "Online"` пры даследаванні яго:
![Скрыншот React DevTools, у якім паказваецца значэнне для адладкі](/images/docs/react-devtools-usedebugvalue.png)
![Здымак экрана React DevTools, у якім паказваецца значэнне для адладкі](/images/docs/react-devtools-usedebugvalue.png)
Без выкліку `useDebugValue` толькі асноўнае значэнне будзе паказанае (у дадзеным прыкладзе, гэта было б `true`).
Без выкліку `useDebugValue` будзе паказана толькі асноўнае значэнне (у дадзеным прыкладзе `true`).
<Sandpack>
Expand Down Expand Up @@ -103,20 +103,20 @@ function subscribe(callback) {
<Note>
Не дадавайце значэнні для адладкі кожнаму хуку. Гэта найбольш патрэбна для тых хукаў, якія з’яўляюцца часткай агульнай бібліятэкі і маюць складаную ўнутраную структуру даных, якую можа быць складана даследваць.
Не дадавайце значэнні для адладкі кожнаму хуку. Іх карысна выкарыстоўваць у хуках, што з'яўляюцца часткай агульнай бібліятэкі і ў хуках са складанай унутранай структурай даных, якую можа быць складана даследаваць.
</Note>
---
### Адтэрміноўка фарматавання значэння для адладкі {/*deferring-formatting-of-a-debug-value*/}
### Адтэрміноўка фармаціравання значэння для адладкі {/*deferring-formatting-of-a-debug-value*/}
Вы заўсёды можаце перадаць функцыю фарматавання ў якасці другога аргумента `useDebugValue`:
Вы заўсёды можаце перадаць функцыю фармаціравання ў якасці другога аргумента `useDebugValue`:
```js [[1, 1, "date", 18], [2, 1, "date.toDateString()"]]
useDebugValue(date, date => date.toDateString());
```
Вашая функцыя фарматавання атрымае <CodeStep step={1}>значэнне для адладкі</CodeStep> ў якасці параметра і мае вярнуць <CodeStep step={2}>фарматаванае значэнне</CodeStep>. Калі вы дасладуеце свой кампанент, React DevTools выклікае функцыю і паказвае вынік выканання.
Вашая функцыя фармаціравання атрымае <CodeStep step={1}>значэнне для адладкі</CodeStep> ў якасці параметра і мае вярнуць <CodeStep step={2}>фармаціраванае значэнне</CodeStep>. Калі вы дасладуеце свой кампанент, React DevTools выклікае функцыю і паказвае вынік выканання.
Гэта дазваляе пазбегнуць выканання патэнцыйна складанай логікі да таго часу, як кампанент будзе даследвацца. Напрыклад, калі `date` — экзэмпляр Date, гэта пазбягае выканання `toDateString()` падчас кожнага перарэндэрынгу.
Гэта дазваляе пазбегнуць выканання патэнцыйна складанай логікі фармаціравання да таго часу, як кампанент будзе даследавацца. Напрыклад, калі `date` мае тып Date, гэта пазбягае выканання `toDateString()` падчас кожнага перарэндэрынгу.

0 comments on commit 8f23b4f

Please sign in to comment.