docs: ✨ translate useState.md + minor terminology fixes#601
docs: ✨ translate useState.md + minor terminology fixes#601pavlosambur wants to merge 1 commit intoreactjs:mainfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎ 1 Skipped Deployment
|
|
@pavlosambur будь ласка, наступного разу атомарно: окремо PR на переклад й окремо PR на фікси, якщо вони не пов'язані |
alinkedd
left a comment
There was a problem hiding this comment.
Дякую за PR і вибач за запізнілу перевірку.
Мені дуже сподобалося, що ти врахував попередні зауваження :) І також сподіваюся, що нові зауваження не позбавлять бажання перекладати ще, та й можна взяти якусь статтю коротше, а то з довгими у мене труднощі :)
| --- | ||
|
|
||
| ## Усунення неполадок {/*troubleshooting*/} | ||
| ## Поширені проблеми {/*troubleshooting*/} |
There was a problem hiding this comment.
| ## Поширені проблеми {/*troubleshooting*/} | |
| ## Усунення проблем {/*troubleshooting*/} |
| --- | ||
|
|
||
| ## Усунення несправностей {/*troubleshooting*/} | ||
| ## Поширені проблеми {/*troubleshooting*/} |
There was a problem hiding this comment.
| ## Поширені проблеми {/*troubleshooting*/} | |
| ## Усунення проблем {/*troubleshooting*/} |
| <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.
| `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.
| Викликачте `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.
| * Якщо ви передаєте функцію як `initialState`, вона спрацює як як _функція-ініціалізатор_. Вона має бути чистою, без аргументів, і повертати будь-яке значення. React викличе її під час ініціалізації компонента й збереже те, що вона поверне, як початковий стан. [Дивіться приклад нижче.](#avoiding-recreating-the-initial-state) | |
| * Якщо ви передаєте функцію як `initialState`, вона спрацює як _функція-ініціалізатор_. Вона має бути чистою, без аргументів, і повертати будь-яке значення. React викличе її під час ініціалізації компонента й збереже те, що вона поверне, як початковий стан. [Дивіться приклад нижче.](#avoiding-recreating-the-initial-state) |
| ``` | ||
|
|
||
| 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.
| Оскільки React викликає вашу функцію-оновлювач двічі, ви побачите, що todo додано двічі — це сигналізує про помилку. У цьому випадку можна виправити це [замінюючи масив новим, а не мутуючи його](#updating-objects-and-arrays-in-state): | |
| Оскільки React викликає вашу функцію-оновлювач двічі, ви побачите, що завдання додано двічі — це сигналізує про помилку. У цьому разі це можна виправити, [замінивши масив новим замість зміни](#updating-objects-and-arrays-in-state): |
| ``` | ||
|
|
||
| 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.
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, тож React ніколи не викликатиме їх двічі. | |
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, і React ніколи не викликатиме їх двічі. |
| Тепер, коли ця функція-оновлювач чиста, її повторний виклик не змінює поведінки. Саме тому подвійний виклик допомагає виявляти помилки. **Лише функції компонента, ініціалізатора та оновлення повинні бути чистими.** Обробники подій не повинні бути чистими, тож React ніколи не викликатиме їх двічі. | ||
|
|
||
| Read [keeping components pure](/learn/keeping-components-pure) to learn more. | ||
| Дізнайтесь більше з розділу [про чистоту компонентів.](/learn/keeping-components-pure) |
There was a problem hiding this comment.
| Дізнайтесь більше з розділу [про чистоту компонентів.](/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.
| ### Я намагаюся зберегти у стан функцію, але вона викликається замість цього {/*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*/} |
| ### Я намагаюся зберегти у стан функцію, але вона викликається замість цього {/*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.
| Не можна зберігати функцію у стан ось так: | |
| Не можна класти функцію у стан ось так: |
Привіт!
Будь ласка, ось переклад сторінки
useState.md.Хочу звернути увагу на кілька моментів:
Я намагаюся дотримуватися інструкцій та вимог, але я ще новачок у вашій поважній спільноті, тож, можливо, ще не до кінця відчув ваш стиль і підходи.
У прикладах коду я переклав усі рядки (strings) кирилицею:
Edward→Едвард,Item→Елементі т.д. Не впевнений, чи це правильно — готовий виправити за потреби.Звертаю окрему увагу на рядки 808–810. Можливо, мені здалося, але в оригіналі автори трохи "відірвалися", тож і я дозволив собі трохи свободи у перекладі :)
Окрім
useState.md, трохи підправив кілька інших сторінок:У
Fragments.mdзамінив "Обмеження" на "Застереження", як це вже прийнято в інших перекладах.У
useContext.mdтаforwardRef.mdзамінив "Усунення несправностей / неполадок" на "Поширені проблеми". Мені здається, це звучить природніше українською. Якщо питання дискусійне — варто уніфікувати термін.У
responding-to-events.mdвиправив "батьківському елементі" на "батьківському компоненті", оскільки йдеться саме про компонент React.Дякую за увагу!
Буду вдячний за зворотний зв'язок і готовий внести правки, якщо щось потрібно покращити 🙌