docs: ✨ translate useState.md + minor terminology fixes #601
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 1 Skipped Deployment
|
|
@pavlosambur будь ласка, наступного разу атомарно: окремо PR на переклад й окремо PR на фікси, якщо вони не пов'язані |
alinkedd
requested changes
May 29, 2025
| @@ -483,7 +483,7 @@ input { | |||
|
|
|||
| --- | |||
|
|
|||
| ## Усунення неполадок {/*troubleshooting*/} | |||
| ## Поширені проблеми {/*troubleshooting*/} | |||
There was a problem hiding this comment.
Suggested change
| ## Поширені проблеми {/*troubleshooting*/} | |
| ## Усунення проблем {/*troubleshooting*/} |
| @@ -1343,7 +1343,7 @@ function MyApp() { | |||
|
|
|||
| --- | |||
|
|
|||
| ## Усунення несправностей {/*troubleshooting*/} | |||
| ## Поширені проблеми {/*troubleshooting*/} | |||
There was a problem hiding this comment.
Suggested change
| ## Поширені проблеми {/*troubleshooting*/} | |
| ## Усунення проблем {/*troubleshooting*/} |
| @@ -4,7 +4,7 @@ title: useState | |||
|
|
|||
| <Intro> | |||
|
|
|||
| `useState` is a React Hook that lets you add a [state variable](/learn/state-a-components-memory) to your component. | |||
| `useState` — хук React, який дозволяє додати [змінну стану](/learn/state-a-components-memory) до вашого компонента. | |||
There was a problem hiding this comment.
Suggested change
| `useState` — хук React, який дозволяє додати [змінну стану](/learn/state-a-components-memory) до вашого компонента. | |
| `useState` — хук React, який дає змогу додати [змінну стану](/learn/state-a-components-memory) до вашого компонента. |
|
|
||
| ### `useState(initialState)` {/*usestate*/} | ||
|
|
||
| Call `useState` at the top level of your component to declare a [state variable.](/learn/state-a-components-memory) | ||
| Викликачте `useState` на верхньому рівні вашого компонента, щоб оголосити [змінну стану.](/learn/state-a-components-memory) |
There was a problem hiding this comment.
Suggested change
| Викликачте `useState` на верхньому рівні вашого компонента, щоб оголосити [змінну стану.](/learn/state-a-components-memory) | |
| Викличте `useState` на верхньому рівні вашого компонента, щоб оголосити [змінну стану.](/learn/state-a-components-memory) |
| * `initialState`: The value you want the state to be initially. It can be a value of any type, but there is a special behavior for functions. This argument is ignored after the initial render. | ||
| * If you pass a function as `initialState`, it will be treated as an _initializer function_. It should be pure, should take no arguments, and should return a value of any type. React will call your initializer function when initializing the component, and store its return value as the initial state. [See an example below.](#avoiding-recreating-the-initial-state) | ||
| * `initialState`: Значення, яке ви хочете встановити як початкове для стану. Це може бути значення будь-якого типу, але якщо це функція — діють особливі правила. Цей аргумент ігнорується після першого рендеру. | ||
| * Якщо ви передаєте функцію як `initialState`, вона спрацює як як _функція-ініціалізатор_. Вона має бути чистою, без аргументів, і повертати будь-яке значення. React викличе її під час ініціалізації компонента й збереже те, що вона поверне, як початковий стан. [Дивіться приклад нижче.](#avoiding-recreating-the-initial-state) |
There was a problem hiding this comment.
Suggested change
| * Якщо ви передаєте функцію як `initialState`, вона спрацює як як _функція-ініціалізатор_. Вона має бути чистою, без аргументів, і повертати будь-яке значення. React викличе її під час ініціалізації компонента й збереже те, що вона поверне, як початковий стан. [Дивіться приклад нижче.](#avoiding-recreating-the-initial-state) | |
| * Якщо ви передаєте функцію як `initialState`, вона спрацює як _функція-ініціалізатор_. Вона має бути чистою, без аргументів, і повертати будь-яке значення. React викличе її під час ініціалізації компонента й збереже те, що вона поверне, як початковий стан. [Дивіться приклад нижче.](#avoiding-recreating-the-initial-state) |
| prevTodos.push(createTodo()); | ||
| }); | ||
| ``` | ||
|
|
||
| Because React calls your updater function twice, you'll see the todo was added twice, so you'll know that there is a mistake. In this example, you can fix the mistake by [replacing the array instead of mutating it](#updating-objects-and-arrays-in-state): | ||
| Оскільки React викликає вашу функцію-оновлювач двічі, ви побачите, що todo додано двічі — це сигналізує про помилку. У цьому випадку можна виправити це [замінюючи масив новим, а не мутуючи його](#updating-objects-and-arrays-in-state): |
There was a problem hiding this comment.
Suggested change
| Оскільки React викликає вашу функцію-оновлювач двічі, ви побачите, що todo додано двічі — це сигналізує про помилку. У цьому випадку можна виправити це [замінюючи масив новим, а не мутуючи його](#updating-objects-and-arrays-in-state): | |
| Оскільки React викликає вашу функцію-оновлювач двічі, ви побачите, що завдання додано двічі — це сигналізує про помилку. У цьому разі це можна виправити, [замінивши масив новим замість зміни](#updating-objects-and-arrays-in-state): |
| return [...prevTodos, createTodo()]; | ||
| }); | ||
| ``` | ||
|
|
||
| Now that this updater function is pure, calling it an extra time doesn't make a difference in behavior. This is why React calling it twice helps you find mistakes. **Only component, initializer, and updater functions need to be pure.** Event handlers don't need to be pure, so React will never call your event handlers twice. | ||
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, тож React ніколи не викликатиме їх двічі. |
There was a problem hiding this comment.
Suggested change
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, тож React ніколи не викликатиме їх двічі. | |
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, і React ніколи не викликатиме їх двічі. |
|
|
||
| Read [keeping components pure](/learn/keeping-components-pure) to learn more. | ||
| Дізнайтесь більше з розділу [про чистоту компонентів.](/learn/keeping-components-pure) |
There was a problem hiding this comment.
Suggested change
| Дізнайтесь більше з розділу [про чистоту компонентів.](/learn/keeping-components-pure) | |
| Дізнайтесь більше з розділу [про чисті компоненти.](/learn/keeping-components-pure) |
|
|
||
| --- | ||
|
|
||
| ### I'm trying to set state to a function, but it gets called instead {/*im-trying-to-set-state-to-a-function-but-it-gets-called-instead*/} | ||
| ### Я намагаюся зберегти у стан функцію, але вона викликається замість цього {/*im-trying-to-set-state-to-a-function-but-it-gets-called-instead*/} |
There was a problem hiding this comment.
Suggested change
| ### Я намагаюся зберегти у стан функцію, але вона викликається замість цього {/*im-trying-to-set-state-to-a-function-but-it-gets-called-instead*/} | |
| ### Я намагаюся зберегти функцію у стані, але натомість вона викликається {/*im-trying-to-set-state-to-a-function-but-it-gets-called-instead*/} |
|
|
||
| You can't put a function into state like this: | ||
| Не можна зберігати функцію у стан ось так: |
There was a problem hiding this comment.
Suggested change
| Не можна зберігати функцію у стан ось так: | |
| Не можна класти функцію у стан ось так: |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Привіт!
Будь ласка, ось переклад сторінки
useState.md.Хочу звернути увагу на кілька моментів:
Я намагаюся дотримуватися інструкцій та вимог, але я ще новачок у вашій поважній спільноті, тож, можливо, ще не до кінця відчув ваш стиль і підходи.
У прикладах коду я переклав усі рядки (strings) кирилицею:
Edward→Едвард,Item→Елементі т.д. Не впевнений, чи це правильно — готовий виправити за потреби.Звертаю окрему увагу на рядки 808–810. Можливо, мені здалося, але в оригіналі автори трохи "відірвалися", тож і я дозволив собі трохи свободи у перекладі :)
Окрім
useState.md, трохи підправив кілька інших сторінок:У
Fragments.mdзамінив "Обмеження" на "Застереження", як це вже прийнято в інших перекладах.У
useContext.mdтаforwardRef.mdзамінив "Усунення несправностей / неполадок" на "Поширені проблеми". Мені здається, це звучить природніше українською. Якщо питання дискусійне — варто уніфікувати термін.У
responding-to-events.mdвиправив "батьківському елементі" на "батьківському компоненті", оскільки йдеться саме про компонент React.Дякую за увагу!
Буду вдячний за зворотний зв'язок і готовий внести правки, якщо щось потрібно покращити 🙌