From 5b14fa64ba47857552526ed612f5dbd35ace3895 Mon Sep 17 00:00:00 2001 From: MaksymMohyla Date: Fri, 21 Feb 2025 15:49:02 +0200 Subject: [PATCH 1/7] translated first 40 lines of useImperativeHandle --- src/content/reference/react/useImperativeHandle.md | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index 00b9893be..669167c07 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -4,7 +4,7 @@ title: useImperativeHandle -`useImperativeHandle` is a React Hook that lets you customize the handle exposed as a [ref.](/learn/manipulating-the-dom-with-refs) +`useImperativeHandle` це хук, який дозволяє кастомізувати об’єкт, який повертається через [реф.](/learn/manipulating-the-dom-with-refs) ```js useImperativeHandle(ref, createHandle, dependencies?) @@ -20,7 +20,7 @@ useImperativeHandle(ref, createHandle, dependencies?) ### `useImperativeHandle(ref, createHandle, dependencies?)` {/*useimperativehandle*/} -Call `useImperativeHandle` at the top level of your component to customize the ref handle it exposes: +Викличте `useImperativeHandle` на верхньому рівні вашого компонента, щоб кастомізувати об'єкт посилання, який повертає реф: ```js import { useImperativeHandle } from 'react'; @@ -28,17 +28,17 @@ import { useImperativeHandle } from 'react'; function MyInput({ ref }) { useImperativeHandle(ref, () => { return { - // ... your methods ... + // ... ваші методи ... }; }, []); // ... ``` -[See more examples below.](#usage) +[Перегляньте більше прикладів нижче.](#usage) -#### Parameters {/*parameters*/} +#### Параметри {/*parameters*/} -* `ref`: The `ref` you received as a prop to the `MyInput` component. +* `ref`: `Реф`, який ви отримали як проп у компоненті `MyInput`. * `createHandle`: A function that takes no arguments and returns the ref handle you want to expose. That ref handle can have any type. Usually, you will return an object with the methods you want to expose. From 37809806ff9dbf857f119015d2f64c986b74600c Mon Sep 17 00:00:00 2001 From: MaksymMohyla Date: Fri, 21 Feb 2025 17:04:30 +0200 Subject: [PATCH 2/7] translated 87 lines in useImperativeHandle --- .../reference/react/useImperativeHandle.md | 26 +++++++++---------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index 669167c07..c31bc9daa 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -4,7 +4,7 @@ title: useImperativeHandle -`useImperativeHandle` це хук, який дозволяє кастомізувати об’єкт, який повертається через [реф.](/learn/manipulating-the-dom-with-refs) +`useImperativeHandle` це хук, який дозволяє кастомізувати об'єкт, який повертається через [реф.](/learn/manipulating-the-dom-with-refs) ```js useImperativeHandle(ref, createHandle, dependencies?) @@ -16,7 +16,7 @@ useImperativeHandle(ref, createHandle, dependencies?) --- -## Reference {/*reference*/} +## Опис {/*reference*/} ### `useImperativeHandle(ref, createHandle, dependencies?)` {/*useimperativehandle*/} @@ -40,27 +40,27 @@ function MyInput({ ref }) { * `ref`: `Реф`, який ви отримали як проп у компоненті `MyInput`. -* `createHandle`: A function that takes no arguments and returns the ref handle you want to expose. That ref handle can have any type. Usually, you will return an object with the methods you want to expose. +* `createHandle`: Функція, яка не приймає аргументів і повертає об'єкт посилання, який ви хочете надати. Цей об’єкт може бути будь-якого типу. Зазвичай, ви повертатимете об'єкт з методами, які ви захочете використовувати. -* **optional** `dependencies`: The list of all reactive values referenced inside of the `createHandle` code. Reactive values include props, state, and all the variables and functions declared directly inside your component body. If your linter is [configured for React](/learn/editor-setup#linting), it will verify that every reactive value is correctly specified as a dependency. The list of dependencies must have a constant number of items and be written inline like `[dep1, dep2, dep3]`. React will compare each dependency with its previous value using the [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is) comparison. If a re-render resulted in a change to some dependency, or if you omitted this argument, your `createHandle` function will re-execute, and the newly created handle will be assigned to the ref. +* **Опціональний параметр** `dependencies`: Список усіх реактивних значень, на які посилається код `createHandle`. Реактивні значення включають в себе пропси, стан та всі змінні та функції, оголошені безпосередньо в тілі компонента. Якщо ваш лінтер [налаштований для Реакту](/learn/editor-setup#linting), він перевірить, чи кожне реактивне значення вказане як залежність. Список залежностей повинен містити стале число елементів, записаних в рядок як `[залежність1, залежність2, залежність3]`. Реакт порівняє кожну залежність із своїм попереднім значенням використовуючи порівняння [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is). Якщо повторний рендер призвів до зміни однієї із залежностей або якщо ви пропустили даний аргумент, ваша `createHandle` функція буде виконана повторно і новостворений об'єкт посилання буде призначений до рефу. -Starting with React 19, [`ref` is available as a prop.](/blog/2024/12/05/react-19#ref-as-a-prop) In React 18 and earlier, it was necessary to get the `ref` from [`forwardRef`.](/reference/react/forwardRef) +Починаючи з React 19 [`реф` доступний як проп.](/blog/2024/12/05/react-19#ref-as-a-prop) У React 18 і старіших версіях необхідно було отримувати `реф` з [`forwardRef`.](/reference/react/forwardRef) -#### Returns {/*returns*/} +#### Результат {/*returns*/} -`useImperativeHandle` returns `undefined`. +`useImperativeHandle` повертає `undefined`. --- -## Usage {/*usage*/} +## Використання {/*usage*/} -### Exposing a custom ref handle to the parent component {/*exposing-a-custom-ref-handle-to-the-parent-component*/} +### Надання кастомного об'єкта посилання батьківському компоненту {/*exposing-a-custom-ref-handle-to-the-parent-component*/} -To expose a DOM node to the parent element, pass in the `ref` prop to the node. +Щоб надати DOM-вузол батьківському елементу, передайте проп ref до цього вузла. ```js {2} function MyInput({ ref }) { @@ -68,7 +68,7 @@ function MyInput({ ref }) { }; ``` -With the code above, [a ref to `MyInput` will receive the `` DOM node.](/learn/manipulating-the-dom-with-refs) However, you can expose a custom value instead. To customize the exposed handle, call `useImperativeHandle` at the top level of your component: +У коді вище [посилання до `MyInput` отримає DOM вузол ``.](/learn/manipulating-the-dom-with-refs) Однак, замість цього ви можете передати кастомне значення. Щоб кастомізувати наданий об'єкт посилання, викличте `useImperativeHandle` на верхньому рівні вашого компонента: ```js {4-8} import { useImperativeHandle } from 'react'; @@ -76,7 +76,7 @@ import { useImperativeHandle } from 'react'; function MyInput({ ref }) { useImperativeHandle(ref, () => { return { - // ... your methods ... + // ... ваші методи ... }; }, []); @@ -84,7 +84,7 @@ function MyInput({ ref }) { }; ``` -Note that in the code above, the `ref` is no longer passed to the ``. +Зверніть увагу, що в наданому вище коді `реф` більше не передається до ``. For example, suppose you don't want to expose the entire `` DOM node, but you want to expose two of its methods: `focus` and `scrollIntoView`. To do this, keep the real browser DOM in a separate ref. Then use `useImperativeHandle` to expose a handle with only the methods that you want the parent component to call: From 1f04c7ffd31b1d9907a1dfba34d116d3a58e8a17 Mon Sep 17 00:00:00 2001 From: MaksymMohyla Date: Sat, 22 Feb 2025 14:37:43 +0200 Subject: [PATCH 3/7] completed translating useImperativeHandle page --- src/content/reference/react/useImperativeHandle.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index c31bc9daa..f0dd63636 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -86,7 +86,7 @@ function MyInput({ ref }) { Зверніть увагу, що в наданому вище коді `реф` більше не передається до ``. -For example, suppose you don't want to expose the entire `` DOM node, but you want to expose two of its methods: `focus` and `scrollIntoView`. To do this, keep the real browser DOM in a separate ref. Then use `useImperativeHandle` to expose a handle with only the methods that you want the parent component to call: +Наприклад, припустимо, ви не хочете використовувати весь вузол DOM ``, а лише два його методи: `focus` і `scrollIntoView`. Щоб зробити це, зберігайте справжній браузерний DOM у окремому посиланні. Потім викличте `useImperativeHandle` щоб повернути об'єкт, який містить лише ті методи, які ви хочете, щоб батьківський компонент викликав: ```js {7-14} import { useRef, useImperativeHandle } from 'react'; @@ -109,7 +109,7 @@ function MyInput({ ref }) { }; ``` -Now, if the parent component gets a ref to `MyInput`, it will be able to call the `focus` and `scrollIntoView` methods on it. However, it will not have full access to the underlying `` DOM node. +Тепер, якщо батьківський компонент передасть реф до `MyInput`, він буде здатний викликати методи `focus` і `scrollIntoView` в компоненті. Однак, він не буде мати повного доступу до DOM вузла ``. @@ -122,7 +122,7 @@ export default function Form() { function handleClick() { ref.current.focus(); - // This won't work because the DOM node isn't exposed: + // Це не спрацює, бо вузол DOM не був представлений: // ref.current.style.opacity = 0.5; } @@ -170,9 +170,9 @@ input { --- -### Exposing your own imperative methods {/*exposing-your-own-imperative-methods*/} +### Передавання власних імперативних методів {/*exposing-your-own-imperative-methods*/} -The methods you expose via an imperative handle don't have to match the DOM methods exactly. For example, this `Post` component exposes a `scrollAndFocusAddComment` method via an imperative handle. This lets the parent `Page` scroll the list of comments *and* focus the input field when you click the button: +Методи, які ви передаєте через імперативний обробник не обов'язково мають точно відповідати DOM методам. Наприклад, даний компонент `Post` передає метод `scrollAndFocusAddComment` через імперативний обробник. Це дозволяє батьківському компоненту `Page` гортати список коментарів *і* фокусуватись на полі введення, коли ви натискаєте кнопку: @@ -285,8 +285,8 @@ export default AddComment; -**Do not overuse refs.** You should only use refs for *imperative* behaviors that you can't express as props: for example, scrolling to a node, focusing a node, triggering an animation, selecting text, and so on. +**Не зловживайте рефами.** Використовуйте рефи лише для *імперативної* поведінки, яку ви не можете виразити через пропси: наприклад, пролистування до вузла DOM, фокусування на вузлі, виклик анімації, виділення тексту тощо. -**If you can express something as a prop, you should not use a ref.** For example, instead of exposing an imperative handle like `{ open, close }` from a `Modal` component, it is better to take `isOpen` as a prop like ``. [Effects](/learn/synchronizing-with-effects) can help you expose imperative behaviors via props. +**Якщо ви можете виразити щось як проп, тоді не варто використовувати реф.** Наприклад, замість передачі імперативного обробника у вигляді `{ open, close }` з компоненту `Modal`, кращим підходом буде використати проп `isOpen` у такому вигляді ``. [Effects](/learn/synchronizing-with-effects) може допомогти вам задавати імперативну поведінку через пропси. From bcaccbeaad3443be64cf8dcd7c13f2baa5eef929 Mon Sep 17 00:00:00 2001 From: MaksymMohyla Date: Tue, 25 Feb 2025 14:14:19 +0200 Subject: [PATCH 4/7] fixed issues --- .../reference/react/useImperativeHandle.md | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index f0dd63636..69ad5ea5b 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -4,7 +4,7 @@ title: useImperativeHandle -`useImperativeHandle` це хук, який дозволяє кастомізувати об'єкт, який повертається через [реф.](/learn/manipulating-the-dom-with-refs) +`useImperativeHandle` — це хук, який дає змогу налаштовувати дескриптор (handle) публічно доступного [рефа.](/learn/manipulating-the-dom-with-refs) ```js useImperativeHandle(ref, createHandle, dependencies?) @@ -20,7 +20,7 @@ useImperativeHandle(ref, createHandle, dependencies?) ### `useImperativeHandle(ref, createHandle, dependencies?)` {/*useimperativehandle*/} -Викличте `useImperativeHandle` на верхньому рівні вашого компонента, щоб кастомізувати об'єкт посилання, який повертає реф: +Викличте `useImperativeHandle` на верхньому рівні вашого компонента, щоб налаштувати дескриптор рефа, доступного з нього: ```js import { useImperativeHandle } from 'react'; @@ -38,11 +38,11 @@ function MyInput({ ref }) { #### Параметри {/*parameters*/} -* `ref`: `Реф`, який ви отримали як проп у компоненті `MyInput`. +* `ref`: `ref`, який ви отримали як проп у компоненті `MyInput`. -* `createHandle`: Функція, яка не приймає аргументів і повертає об'єкт посилання, який ви хочете надати. Цей об’єкт може бути будь-якого типу. Зазвичай, ви повертатимете об'єкт з методами, які ви захочете використовувати. +* `createHandle`: Функція, яка не приймає аргументів і повертає дескриптор рефа, до якого ви хочете надати доступ. Дескриптор може бути будь-якого типу. Зазвичай, ви повертатимете об'єкт із методами, до яких ви хочете надати доступ. -* **Опціональний параметр** `dependencies`: Список усіх реактивних значень, на які посилається код `createHandle`. Реактивні значення включають в себе пропси, стан та всі змінні та функції, оголошені безпосередньо в тілі компонента. Якщо ваш лінтер [налаштований для Реакту](/learn/editor-setup#linting), він перевірить, чи кожне реактивне значення вказане як залежність. Список залежностей повинен містити стале число елементів, записаних в рядок як `[залежність1, залежність2, залежність3]`. Реакт порівняє кожну залежність із своїм попереднім значенням використовуючи порівняння [`Object.is`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is). Якщо повторний рендер призвів до зміни однієї із залежностей або якщо ви пропустили даний аргумент, ваша `createHandle` функція буде виконана повторно і новостворений об'єкт посилання буде призначений до рефу. +* **Опційний параметр** `dependencies`: Список усіх реактивних значень, на які посилається код `createHandle`. Реактивні значення охоплюють пропси, стан і всі змінні та функції, оголошені безпосередньо в тілі компонента. Якщо ваш лінтер [налаштований для React](/learn/editor-setup#linting), він перевірить, чи кожне реактивне значення вказане як залежність. Список залежностей повинен містити стале число елементів, записаних у рядок як `[залежність1, залежність2, залежність3]`. React порівняє кожну залежність із своїм попереднім значенням, використовуючи функцію [`Object.is`](https://webdoky.org/uk/docs/Web/JavaScript/Reference/Global_Objects/Object/is). Якщо повторний рендер призвів до зміни однієї із залежностей або якщо ви пропустили даний аргумент, ваша функція `createHandle` виконуватиметься повторно, і новостворений дескриптор буде призначений рефу. @@ -128,9 +128,9 @@ export default function Form() { return (
- + ); @@ -170,9 +170,9 @@ input { --- -### Передавання власних імперативних методів {/*exposing-your-own-imperative-methods*/} +### Надання доступу до власних імперативних методів {/*exposing-your-own-imperative-methods*/} -Методи, які ви передаєте через імперативний обробник не обов'язково мають точно відповідати DOM методам. Наприклад, даний компонент `Post` передає метод `scrollAndFocusAddComment` через імперативний обробник. Це дозволяє батьківському компоненту `Page` гортати список коментарів *і* фокусуватись на полі введення, коли ви натискаєте кнопку: +Методи, які ви передаєте через імперативний дескриптор, не обов'язково мають точно збігатися з DOM методами. Наприклад, цей компонент `Post` передає метод `scrollAndFocusAddComment` через дескриптор. Це дає батьківському компоненту `Page` змогу прогорнути список коментарів *і* фокусувати поле введення, коли ви натискаєте кнопку: @@ -190,7 +190,7 @@ export default function Page() { return ( <> @@ -219,7 +219,7 @@ function Post({ ref }) { return ( <>
-

Welcome to my blog!

+

Вітаю на моєму блозі!

@@ -248,7 +248,7 @@ function CommentList({ ref }) { let comments = []; for (let i = 0; i < 50; i++) { - comments.push(

Comment #{i}

); + comments.push(

Коментар #{i}

); } return ( @@ -265,7 +265,7 @@ export default CommentList; import { useRef, useImperativeHandle } from 'react'; function AddComment({ ref }) { - return ; + return ; } export default AddComment; @@ -285,8 +285,8 @@ export default AddComment; -**Не зловживайте рефами.** Використовуйте рефи лише для *імперативної* поведінки, яку ви не можете виразити через пропси: наприклад, пролистування до вузла DOM, фокусування на вузлі, виклик анімації, виділення тексту тощо. +**Не зловживайте рефами.** Використовуйте рефи лише для *імперативної* поведінки, яку ви не можете виразити через пропси: наприклад, прогортування до вузла DOM, фокусування вузла, виклик анімації, виділення тексту тощо. -**Якщо ви можете виразити щось як проп, тоді не варто використовувати реф.** Наприклад, замість передачі імперативного обробника у вигляді `{ open, close }` з компоненту `Modal`, кращим підходом буде використати проп `isOpen` у такому вигляді ``. [Effects](/learn/synchronizing-with-effects) може допомогти вам задавати імперативну поведінку через пропси. +**Якщо ви можете виразити щось як проп, тоді не варто використовувати реф.** Наприклад, замість передавання імперативного дескриптора як `{ open, close }` із компонента `Modal`, краще використати проп `isOpen` як ``. [Ефекти](/learn/synchronizing-with-effects) можуть допомогти вам надати доступ до імперативних частин через пропси. From 250791d4d2d04f9a5962b9521d22798262d278f8 Mon Sep 17 00:00:00 2001 From: MaksymMohyla Date: Wed, 26 Feb 2025 17:59:16 +0200 Subject: [PATCH 5/7] Apply suggestions from code review fixed more issues Co-authored-by: Alina Listunova --- .../reference/react/useImperativeHandle.md | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index 69ad5ea5b..aac33403e 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -46,7 +46,7 @@ function MyInput({ ref }) { -Починаючи з React 19 [`реф` доступний як проп.](/blog/2024/12/05/react-19#ref-as-a-prop) У React 18 і старіших версіях необхідно було отримувати `реф` з [`forwardRef`.](/reference/react/forwardRef) +Починаючи з React 19, [`ref` доступний як проп.](/blog/2024/12/05/react-19#ref-as-a-prop) У React 18 і старіших версіях необхідно було отримувати `ref` із [`forwardRef`.](/reference/react/forwardRef) @@ -58,9 +58,9 @@ function MyInput({ ref }) { ## Використання {/*usage*/} -### Надання кастомного об'єкта посилання батьківському компоненту {/*exposing-a-custom-ref-handle-to-the-parent-component*/} +### Доступ батьківського елемента до налаштованого дескриптора рефа {/*exposing-a-custom-ref-handle-to-the-parent-component*/} -Щоб надати DOM-вузол батьківському елементу, передайте проп ref до цього вузла. +Щоб надати доступ до DOM-вузла батьківському елементу, передайте проп `ref` далі до цього вузла. ```js {2} function MyInput({ ref }) { @@ -68,7 +68,7 @@ function MyInput({ ref }) { }; ``` -У коді вище [посилання до `MyInput` отримає DOM вузол ``.](/learn/manipulating-the-dom-with-refs) Однак, замість цього ви можете передати кастомне значення. Щоб кастомізувати наданий об'єкт посилання, викличте `useImperativeHandle` на верхньому рівні вашого компонента: +У коді вище [реф, переданий компоненту `MyInput`, отримає DOM-вузол ``.](/learn/manipulating-the-dom-with-refs) Однак, замість цього ви можете задати власне значення. Щоб налаштувати публічний дескриптор, викличте `useImperativeHandle` на верхньому рівні вашого компонента: ```js {4-8} import { useImperativeHandle } from 'react'; @@ -84,9 +84,9 @@ function MyInput({ ref }) { }; ``` -Зверніть увагу, що в наданому вище коді `реф` більше не передається до ``. +Зверніть увагу, що в наведеному вище коді `ref` більше не передається елементу ``. -Наприклад, припустимо, ви не хочете використовувати весь вузол DOM ``, а лише два його методи: `focus` і `scrollIntoView`. Щоб зробити це, зберігайте справжній браузерний DOM у окремому посиланні. Потім викличте `useImperativeHandle` щоб повернути об'єкт, який містить лише ті методи, які ви хочете, щоб батьківський компонент викликав: +Наприклад, припустимо, що ви не хочете робити публічним весь DOM-вузол ``, а лише два його методи: `focus` і `scrollIntoView`. У цьому разі зберігайте справжній браузерний DOM в окремому рефі. Потім викличте `useImperativeHandle`, щоб надати доступ до дескриптора, який містить лише методи, необхідні для виклику батьківським компонентом: ```js {7-14} import { useRef, useImperativeHandle } from 'react'; @@ -109,7 +109,7 @@ function MyInput({ ref }) { }; ``` -Тепер, якщо батьківський компонент передасть реф до `MyInput`, він буде здатний викликати методи `focus` і `scrollIntoView` в компоненті. Однак, він не буде мати повного доступу до DOM вузла ``. +Тепер якщо батьківський компонент передасть реф до `MyInput`, він зможе викликати його методи `focus` і `scrollIntoView`. Однак, він не буде мати повного доступу до справжнього DOM-вузла ``. @@ -122,7 +122,7 @@ export default function Form() { function handleClick() { ref.current.focus(); - // Це не спрацює, бо вузол DOM не був представлений: + // Це не спрацює, бо вузол DOM не публічний: // ref.current.style.opacity = 0.5; } From 5229945209c1c5aeb82ab7eed4fd7d53833f2e30 Mon Sep 17 00:00:00 2001 From: Alina Listunova Date: Wed, 26 Feb 2025 17:06:30 +0100 Subject: [PATCH 6/7] Apply suggestions from code review --- src/content/reference/react/useImperativeHandle.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index aac33403e..a1c042fd8 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -130,7 +130,7 @@ export default function Form() {
); @@ -219,7 +219,7 @@ function Post({ ref }) { return ( <>
-

Вітаю на моєму блозі!

+

Вітаю в моєму блозі!

From 6b4aa4e57a49d2710d9667c6262250b9d21227c1 Mon Sep 17 00:00:00 2001 From: Alina Listunova Date: Wed, 26 Feb 2025 17:14:15 +0100 Subject: [PATCH 7/7] Update src/content/reference/react/useImperativeHandle.md --- src/content/reference/react/useImperativeHandle.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/reference/react/useImperativeHandle.md b/src/content/reference/react/useImperativeHandle.md index a1c042fd8..4b681ff52 100644 --- a/src/content/reference/react/useImperativeHandle.md +++ b/src/content/reference/react/useImperativeHandle.md @@ -172,7 +172,7 @@ input { ### Надання доступу до власних імперативних методів {/*exposing-your-own-imperative-methods*/} -Методи, які ви передаєте через імперативний дескриптор, не обов'язково мають точно збігатися з DOM методами. Наприклад, цей компонент `Post` передає метод `scrollAndFocusAddComment` через дескриптор. Це дає батьківському компоненту `Page` змогу прогорнути список коментарів *і* фокусувати поле введення, коли ви натискаєте кнопку: +Методи, які ви передаєте через імперативний дескриптор, не обов'язково мають точно збігатися з DOM-методами. Наприклад, цей компонент `Post` передає метод `scrollAndFocusAddComment` через дескриптор. Це дає батьківському компоненту `Page` змогу прогорнути список коментарів *і* фокусувати поле введення, коли ви натискаєте кнопку: