From b5c7ade32a742fbd98c45f47cae61137413fe352 Mon Sep 17 00:00:00 2001 From: alinkedd Date: Fri, 27 Oct 2023 04:37:02 +0300 Subject: [PATCH 1/2] Resolve merge conflicts --- src/content/learn/importing-and-exporting-components.md | 6 +----- src/content/learn/your-first-component.md | 6 +----- src/content/reference/react-dom/createPortal.md | 8 ++------ src/content/reference/react/Fragment.md | 6 +----- src/content/reference/react/forwardRef.md | 6 +----- 5 files changed, 6 insertions(+), 26 deletions(-) diff --git a/src/content/learn/importing-and-exporting-components.md b/src/content/learn/importing-and-exporting-components.md index 7c486f3a8..9382371ae 100644 --- a/src/content/learn/importing-and-exporting-components.md +++ b/src/content/learn/importing-and-exporting-components.md @@ -52,11 +52,7 @@ img { margin: 0 10px 10px 0; height: 90px; } -<<<<<<< HEAD -Ці компоненти зараз знаходяться в **файлі кореневого компонента** з назвою `App.js` в цьому прикладі. У [Create React App](https://create-react-app.dev/) ваш додаток знаходиться в `src/App.js`. Залежно від вашої конфігурації, ваш кореневий компонент може бути у іншому файлі. Якщо ви використовуєте фреймворк з роутингом на основі файлів, такий як Next.js, ваш кореневий компонент буде різним для кожної сторінки. -======= -These currently live in a **root component file,** named `App.js` in this example. Depending on your setup, your root component could be in another file, though. If you use a framework with file-based routing, such as Next.js, your root component will be different for every page. ->>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb +Ці компоненти зараз знаходяться у **файлі кореневого компонента** з назвою `App.js` у цьому прикладі. Залежно від вашої конфігурації ваш кореневий компонент може бути в іншому файлі. Якщо ви використовуєте фреймворк з роутингом на основі файлів, як-от Next.js, ваш кореневий компонент буде різним для кожної сторінки. ## Експорт та імпорт компонента {/*exporting-and-importing-a-component*/} diff --git a/src/content/learn/your-first-component.md b/src/content/learn/your-first-component.md index a5f9f7be1..b593436a3 100644 --- a/src/content/learn/your-first-component.md +++ b/src/content/learn/your-first-component.md @@ -210,11 +210,7 @@ function Profile() { #### Компоненти на всій глибині {/*components-all-the-way-down*/} -<<<<<<< HEAD -Ваш React додаток починається з "кореневого" компонента. Зазвичай він створюється автоматично, коли ви створюєте новий проект. Наприклад, якщо ви використовуєте [CodeSandbox](https://codesandbox.io/) або [Create React App](https://create-react-app.dev/), кореневий компонент визначений в `src/App.js`. Якщо ви використовуєте фреймворк [Next.js](https://nextjs.org/), кореневий компонент визначений в `pages/index.js`. У цих прикладах ви експортували кореневі компоненти. -======= -Your React application begins at a "root" component. Usually, it is created automatically when you start a new project. For example, if you use [CodeSandbox](https://codesandbox.io/) or if you use the framework [Next.js](https://nextjs.org/), the root component is defined in `pages/index.js`. In these examples, you've been exporting root components. ->>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb +Ваш React додаток починається з "кореневого" компонента. Зазвичай він створюється автоматично, коли ви створюєте новий проект. Наприклад, якщо ви використовуєте [CodeSandbox](https://codesandbox.io/) або якщо ви використовуєте фреймворк [Next.js](https://nextjs.org/), кореневий компонент визначений в `pages/index.js`. У цих прикладах ви експортуєте кореневі компоненти. Більшість додатків React використовують компоненти на всій глибині. Це означає, що ви будете використовувати компоненти не тільки для повторно використовуваних елементів, таких як кнопки, але й для більших елементів, таких як бічні панелі, списки та, врешті-решт, цілі сторінки! Компоненти - зручний спосіб організації коду UI та розмітки, навіть якщо деякі з них використовуються лише один раз. diff --git a/src/content/reference/react-dom/createPortal.md b/src/content/reference/react-dom/createPortal.md index 30859d14f..57db2d019 100644 --- a/src/content/reference/react-dom/createPortal.md +++ b/src/content/reference/react-dom/createPortal.md @@ -50,13 +50,9 @@ import { createPortal } from 'react-dom'; * `domNode`: DOM-вузол, наприклад повернутий з `document.getElementById()`. Переданий вузол вже повинен існувати. Передавання різних DOM-вузлів під час оновлення спричинить повторне створення контенту всередині порталу. -<<<<<<< HEAD -#### Результат {/*returns*/} -======= -* **optional** `key`: A unique string or number to be used as the portal's [key.](/learn/rendering-lists/#keeping-list-items-in-order-with-key) +* **опційний** `key`: Унікальна рядкова або числова змінна, що використовується як [ключ](/learn/rendering-lists/#keeping-list-items-in-order-with-key) порталу. -#### Returns {/*returns*/} ->>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb +#### Результат {/*returns*/} `createPortal` повертає React-вузол, який може бути включеним в JSX або ж повернутим з React-компонента. Якщо React зіткнеться з таким у виводі рендеру, він помістить надані `children` всередину переданого `domNode`. diff --git a/src/content/reference/react/Fragment.md b/src/content/reference/react/Fragment.md index fd47fc112..f71b1cd9a 100644 --- a/src/content/reference/react/Fragment.md +++ b/src/content/reference/react/Fragment.md @@ -54,11 +54,7 @@ function Post() { } ``` -<<<<<<< HEAD -Фрагменти є корисним інструментом, оскільки групування елементів з `Fragment` не має впливу на розташування або стилізацію, на відміну від огортання елементів в інший контейнер, такий як DOM-елемент. Якщо ви перевірите цей приклад за допомогою інструментів браузера, ви побачите, що всі DOM-вузли `

` і `

` відображаються як сусідні елементи без обгорток навколо них: -======= -Fragments are useful because grouping elements with a Fragment has no effect on layout or styles, unlike if you wrapped the elements in another container like a DOM element. If you inspect this example with the browser tools, you'll see that all `

` and `
` DOM nodes appear as siblings without wrappers around them: ->>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb +Фрагменти є корисним інструментом, оскільки групування елементів з `Fragment` не має впливу на розташування або стилізацію, на відміну від огортання елементів в інший контейнер, такий як DOM-елемент. Якщо ви перевірите цей приклад за допомогою інструментів браузера, ви побачите, що всі DOM-вузли `

` і `
` відображаються як сусідні елементи без обгорток навколо них: diff --git a/src/content/reference/react/forwardRef.md b/src/content/reference/react/forwardRef.md index ea304bbd3..79b9d434b 100644 --- a/src/content/reference/react/forwardRef.md +++ b/src/content/reference/react/forwardRef.md @@ -134,11 +134,7 @@ function Form() { Пам'ятайте, що розкриття рефу DOM-вузла всередині вашого компонента робить важчою зміну внутрішніх частин компонента пізніше. Зазвичай, ви будете розкривати DOM-вузли з компонентів нижнього рівня, що перевикористовуються (як-от кнопки та поля вводу), та не будете робити це із глобальними компонентами, такими як аватар чи коментар. -<<<<<<< HEAD - -======= - ->>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb + #### Фокусування на текстовому полі {/*focusing-a-text-input*/} From 1394f05f009e764580943aca082e60f88cd112bc Mon Sep 17 00:00:00 2001 From: Bohdan Katsevych <94533356+bkatsevych@users.noreply.github.com> Date: Mon, 6 Nov 2023 21:41:38 +0200 Subject: [PATCH 2/2] Update src/content/reference/react-dom/createPortal.md --- src/content/reference/react-dom/createPortal.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/reference/react-dom/createPortal.md b/src/content/reference/react-dom/createPortal.md index 57db2d019..45ed1b994 100644 --- a/src/content/reference/react-dom/createPortal.md +++ b/src/content/reference/react-dom/createPortal.md @@ -50,7 +50,7 @@ import { createPortal } from 'react-dom'; * `domNode`: DOM-вузол, наприклад повернутий з `document.getElementById()`. Переданий вузол вже повинен існувати. Передавання різних DOM-вузлів під час оновлення спричинить повторне створення контенту всередині порталу. -* **опційний** `key`: Унікальна рядкова або числова змінна, що використовується як [ключ](/learn/rendering-lists/#keeping-list-items-in-order-with-key) порталу. +* **опційний** `key`: Унікальна стрічкова або числова змінна, що використовується як [ключ](/learn/rendering-lists/#keeping-list-items-in-order-with-key) порталу. #### Результат {/*returns*/}