Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Resolve merge conflicts #490

Closed
wants to merge 2 commits into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 1 addition & 5 deletions src/content/learn/importing-and-exporting-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -52,11 +52,7 @@ img { margin: 0 10px 10px 0; height: 90px; }

</Sandpack>

<<<<<<< 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*/}

Expand Down
6 changes: 1 addition & 5 deletions src/content/learn/your-first-component.md
Original file line number Diff line number Diff line change
Expand Up @@ -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 та розмітки, навіть якщо деякі з них використовуються лише один раз.

Expand Down
8 changes: 2 additions & 6 deletions src/content/reference/react-dom/createPortal.md
Original file line number Diff line number Diff line change
Expand Up @@ -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`.

Expand Down
6 changes: 1 addition & 5 deletions src/content/reference/react/Fragment.md
Original file line number Diff line number Diff line change
Expand Up @@ -54,11 +54,7 @@ function Post() {
}
```

<<<<<<< HEAD
Фрагменти є корисним інструментом, оскільки групування елементів з `Fragment` не має впливу на розташування або стилізацію, на відміну від огортання елементів в інший контейнер, такий як DOM-елемент. Якщо ви перевірите цей приклад за допомогою інструментів браузера, ви побачите, що всі DOM-вузли `<h1>` і `<p>` відображаються як сусідні елементи без обгорток навколо них:
=======
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 `<h1>` and `<article>` DOM nodes appear as siblings without wrappers around them:
>>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb
Фрагменти є корисним інструментом, оскільки групування елементів з `Fragment` не має впливу на розташування або стилізацію, на відміну від огортання елементів в інший контейнер, такий як DOM-елемент. Якщо ви перевірите цей приклад за допомогою інструментів браузера, ви побачите, що всі DOM-вузли `<h1>` і `<article>` відображаються як сусідні елементи без обгорток навколо них:

<Sandpack>

Expand Down
6 changes: 1 addition & 5 deletions src/content/reference/react/forwardRef.md
Original file line number Diff line number Diff line change
Expand Up @@ -134,11 +134,7 @@ function Form() {

Пам'ятайте, що розкриття рефу DOM-вузла всередині вашого компонента робить важчою зміну внутрішніх частин компонента пізніше. Зазвичай, ви будете розкривати DOM-вузли з компонентів нижнього рівня, що перевикористовуються (як-от кнопки та поля вводу), та не будете робити це із глобальними компонентами, такими як аватар чи коментар.

<<<<<<< HEAD
<Recipes title="Приклади направлення рефу">
=======
<Recipes titleText="Examples of forwarding a ref">
>>>>>>> a0cacd7d3a89375e5689ccfba0461e293bfe9eeb
<Recipes titleText="Приклади направлення рефу">

#### Фокусування на текстовому полі {/*focusing-a-text-input*/}

Expand Down
Loading