Skip to content

Commit 8e9aba9

Browse files
docs: translate captureOwnerStack.md to Русский
1 parent 44a9be3 commit 8e9aba9

1 file changed

Lines changed: 33 additions & 34 deletions

File tree

src/content/reference/react/captureOwnerStack.md

Lines changed: 33 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,9 @@
11
---
22
title: captureOwnerStack
33
---
4-
54
<Intro>
65

7-
`captureOwnerStack` считывает текущий стек владельца (Owner Stack) в режиме разработки и возвращает его в виде строки, если он доступен.
6+
`captureOwnerStack` считывает текущий стек владельцев (Owner Stack) в режиме разработки и возвращает его в виде строки, если он доступен.
87

98
```js
109
const stack = captureOwnerStack();
@@ -20,7 +19,7 @@ const stack = captureOwnerStack();
2019

2120
### `captureOwnerStack()` {/*captureownerstack*/}
2221

23-
Вызовите `captureOwnerStack`, чтобы получить текущий стек владельца.
22+
Вызовите `captureOwnerStack`, чтобы получить текущий стек владельцев.
2423

2524
```js {5,5}
2625
import * as React from 'react';
@@ -37,27 +36,27 @@ function Component() {
3736

3837
`captureOwnerStack` не принимает никаких параметров.
3938

40-
#### Возвращаемое значение {/*returns*/}
39+
#### Возвращает {/*returns*/}
4140

4241
`captureOwnerStack` возвращает `string | null`.
4342

44-
Стеки владельца доступны в:
43+
Стеки владельцев доступны в:
4544
- Рендере компонента
4645
- Эффектах (например, `useEffect`)
4746
- Обработчиках событий React (например, `<button onClick={...} />`)
48-
- Обработчиках ошибок React ([Параметры React Root](/reference/react-dom/client/createRoot#parameters) `onCaughtError`, `onRecoverableError` и `onUncaughtError`)
47+
- Обработчиках ошибок React ([параметры React Root](/reference/react-dom/client/createRoot#parameters) `onCaughtError`, `onRecoverableError` и `onUncaughtError`)
4948

50-
Если стек владельца недоступен, возвращается `null` (см. [Устранение неполадок: Стек владельца равен `null`](#the-owner-stack-is-null)).
49+
Если стек владельцев недоступен, возвращается `null` (см. [Устранение неполадок: Стек владельцев равен `null`](#the-owner-stack-is-null)).
5150

5251
#### Ограничения {/*caveats*/}
5352

54-
- Стеки владельца доступны только в режиме разработки. `captureOwnerStack` всегда будет возвращать `null` вне режима разработки.
53+
- Стеки владельцев доступны только в режиме разработки. `captureOwnerStack` всегда будет возвращать `null` вне режима разработки.
5554

5655
<DeepDive>
5756

58-
#### Стек владельца против стека компонентов {/*owner-stack-vs-component-stack*/}
57+
#### Стек владельцев против стека компонентов {/*owner-stack-vs-component-stack*/}
5958

60-
Стек владельца отличается от стека компонентов, доступного в обработчиках ошибок React, таких как [`errorInfo.componentStack` в `onUncaughtError`](/reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors).
59+
Стек владельцев отличается от стека компонентов, доступного в обработчиках ошибок React, таких как [`errorInfo.componentStack` в `onUncaughtError`](/reference/react-dom/client/hydrateRoot#show-a-dialog-for-uncaught-errors).
6160

6261
Рассмотрим следующий код:
6362

@@ -106,10 +105,10 @@ import './styles.css';
106105
createRoot(document.createElement('div'), {
107106
onUncaughtError: (error, errorInfo) => {
108107
// Стеки выводятся в лог вместо прямого отображения в UI, чтобы
109-
// подчеркнуть, что браузеры применяют sourcemaps к выведенным стекам.
108+
// подчеркнуть, что браузеры применяют sourcemaps к логгируемым стекам.
110109
// Обратите внимание, что sourcemapping применяется только в реальной консоли браузера, а не
111110
// в поддельной, отображаемой на этой странице.
112-
// Нажмите "fork", чтобы иметь возможность просмотреть стек с примененным sourcemapping в реальной консоли.
111+
// Нажмите "fork", чтобы иметь возможность просмотреть стек с применением sourcemap в реальной консоли.
113112
console.log(errorInfo.componentStack);
114113
console.log(captureOwnerStack());
115114
},
@@ -148,17 +147,17 @@ at React.Suspense
148147
at App
149148
```
150149

151-
Однако стек владельца будет содержать только:
150+
Однако стек владельцев будет содержать только:
152151

153152
```
154153
at Component
155154
```
156155

157-
Ни `App`, ни DOM-компоненты (например, `fieldset`) не считаются владельцами в этом стеке, поскольку они не участвовали в «создании» узла, содержащего `SubComponent`. `App` и DOM-компоненты только перенаправляли узел. `App` просто отрендерил узел `children`, в отличие от `Component`, который создал узел, содержащий `SubComponent`, через `<SubComponent />`.
156+
Ни `App`, ни DOM-компоненты (например, `fieldset`) не считаются владельцами в этом стеке, поскольку они не способствовали "созданию" узла, содержащего `SubComponent`. `App` и DOM-компоненты только перенаправляли узел. `App` просто отрендерил узел `children`, в отличие от `Component`, который создал узел, содержащий `SubComponent`, через `<SubComponent />`.
158157

159158
Ни `Navigation`, ни `legend` вообще не присутствуют в стеке, поскольку они являются лишь соседями узла, содержащего `<SubComponent />`.
160159

161-
`SubComponent` опущен, потому что он уже является частью стека вызовов.
160+
`SubComponent` пропущен, потому что он уже является частью стека вызовов.
162161

163162
</DeepDive>
164163

@@ -183,7 +182,7 @@ console.error = function patchedConsoleError(...args) {
183182
};
184183
```
185184

186-
Если вы перехватываете вызовы <CodeStep step={1}>`console.error`</CodeStep>, чтобы отобразить их в оверлее ошибок, вы можете вызвать <CodeStep step={2}>`captureOwnerStack`</CodeStep>, чтобы включить стек владельца.
185+
Если вы перехватываете вызовы <CodeStep step={1}>`console.error`</CodeStep>, чтобы выделить их в оверлее ошибок, вы можете вызвать <CodeStep step={2}>`captureOwnerStack`</CodeStep>, чтобы включить стек владельцев.
187186

188187
<Sandpack>
189188

@@ -269,25 +268,25 @@ pre.nowrap {
269268
</head>
270269
<body>
271270
<!--
272-
Error dialog in raw HTML
273-
since an error in the React app may crash.
271+
Диалог ошибок в сыром HTML,
272+
поскольку ошибка в приложении React может привести к сбою.
274273
-->
275274
<div id="error-dialog" class="hidden">
276-
<h1 id="error-title" class="text-red">Error</h1>
275+
<h1 id="error-title" class="text-red">Ошибка</h1>
277276
<p>
278277
<pre id="error-body"></pre>
279278
</p>
280-
<h2 class="-mb-20">Owner Stack:</h4>
279+
<h2 class="-mb-20">Стек владельцев:</h4>
281280
<pre id="error-owner-stack" class="nowrap"></pre>
282281
<button
283282
id="error-close"
284283
class="mb-10"
285284
onclick="document.getElementById('error-dialog').classList.add('hidden')"
286285
>
287-
Close
286+
Закрыть
288287
</button>
289288
</div>
290-
<!-- This is the DOM node -->
289+
<!-- Это DOM-узел -->
291290
<div id="root"></div>
292291
</body>
293292
</html>
@@ -301,13 +300,13 @@ export function onConsoleError({ consoleMessage, ownerStack }) {
301300
const errorBody = document.getElementById("error-body");
302301
const errorOwnerStack = document.getElementById("error-owner-stack");
303302

304-
// Display console.error() message
303+
// Отображение сообщения console.error()
305304
errorBody.innerText = consoleMessage;
306305

307-
// Display owner stack
306+
// Отображение стека владельцев
308307
errorOwnerStack.innerText = ownerStack;
309308

310-
// Show the dialog
309+
// Показать диалог
311310
errorDialog.classList.remove("hidden");
312311
}
313312
```
@@ -324,8 +323,8 @@ console.error = function patchedConsoleError(...args) {
324323
originalConsoleError.apply(console, args);
325324
const ownerStack = captureOwnerStack();
326325
onConsoleError({
327-
// Keep in mind that in a real application, console.error can be
328-
// called with multiple arguments which you should account for.
326+
// Имейте в виду, что в реальном приложении console.error может быть
327+
// вызван с несколькими аргументами, которые следует учитывать.
329328
consoleMessage: args[0],
330329
ownerStack,
331330
});
@@ -349,11 +348,11 @@ export default function App() {
349348

350349
## Устранение неполадок {/*troubleshooting*/}
351350

352-
### Стек владельца равен `null` {/*the-owner-stack-is-null*/}
351+
### Стек владельцев равен `null` {/*the-owner-stack-is-null*/}
353352

354-
Вызов `captureOwnerStack` произошел вне функции, управляемой React, например, в колбэке `setTimeout`, после вызова `fetch` или в пользовательском обработчике событий DOM. Во время рендеринга, эффектов, обработчиков событий React и обработчиков ошибок React (например, `hydrateRoot#options.onCaughtError`) стеки владельца должны быть доступны.
353+
Вызов `captureOwnerStack` произошел вне функции, управляемой React, например, в колбэке `setTimeout`, после вызова `fetch` или в пользовательском обработчике событий DOM. Во время рендеринга, эффектов, обработчиков событий React и обработчиков ошибок React (например, `hydrateRoot#options.onCaughtError`) стеки владельцев должны быть доступны.
355354

356-
В приведенном ниже примере нажатие на кнопку приведет к выводу пустого стека владельца, поскольку `captureOwnerStack` был вызван во время пользовательского обработчика событий DOM. Стек владельца должен быть захвачен раньше, например, путем перемещения вызова `captureOwnerStack` в тело эффекта.
355+
В приведенном ниже примере нажатие на кнопку приведет к выводу пустого стека владельцев, поскольку `captureOwnerStack` был вызван во время пользовательского обработчика событий DOM. Стек владельцев должен быть захвачен раньше, например, путем перемещения вызова `captureOwnerStack` в тело эффекта.
357356
<Sandpack>
358357

359358
```js
@@ -363,8 +362,8 @@ export default function App() {
363362
useEffect(() => {
364363
// Следует вызвать `captureOwnerStack` здесь.
365364
function handleEvent() {
366-
// Вызов в пользовательском обработчике событий DOM — это слишком поздно.
367-
// Стек владельца в этот момент будет равен `null`.
365+
// Вызов в пользовательском обработчике событий DOM слишком поздний.
366+
// Стек владельцев к этому моменту будет равен `null`.
368367
console.log('Owner Stack: ', captureOwnerStack());
369368
}
370369

@@ -375,15 +374,15 @@ export default function App() {
375374
}
376375
})
377376

378-
return <button>Click me to see that Owner Stacks are not available in custom DOM event handlers</button>;
377+
return <button>Нажмите меня, чтобы увидеть, что стеки владельцев недоступны в пользовательских обработчиках событий DOM</button>;
379378
}
380379
```
381380

382381
</Sandpack>
383382

384383
### `captureOwnerStack` недоступен {/*captureownerstack-is-not-available*/}
385384

386-
`captureOwnerStack` экспортируется только в сборках для разработки. В продакшен-сборках он будет `undefined`. Если `captureOwnerStack` используется в файлах, которые собираются как для продакшена, так и для разработки, следует получать к нему доступ условно из импорта пространства имен.
385+
`captureOwnerStack` экспортируется только в сборках для разработки. В продакшен-сборках он будет равен `undefined`. Если `captureOwnerStack` используется в файлах, которые собираются как для продакшена, так и для разработки, следует получать к нему доступ условно из импорта пространства имен.
387386

388387
```js
389388
// Не используйте именованные импорты `captureOwnerStack` в файлах, которые собираются для разработки и продакшена.

0 commit comments

Comments
 (0)