Скачать или смотреть Не тільки props! Як передавати дані в React за допомогою useContext • Програмування українською 🇺🇦

React Context — це інструмент, який надається бібліотекою React для управління станом на рівні додатка без необхідності передавати пропси через кожен компонент дерева.

Готовий код: https://github.com/burlai/simple-fron...
#react #reacttutorial #контентукраїнською

------------------------------------------------------------------------
Привіт, звати мене Костянтин, я працюю senior фронтенд розробником в Samsung Electronics. Мій профіль:   / kostiantyn-burlai  
В цьому відео, а також в серії наступних я буду представляти найголовніше, що ви маєте знати про програмування з React JS.

Підтримати канал можна тут: https://www.buymeacoffee.com/simplefr...
Дякую :)
--------------------------------------------------------------------------

Створення Context:
Щоб створити Context, використовується функція React.createContext(). Вона повертає об'єкт Context, який містить два основних компоненти: Provider та Consumer.

Provider:
Це компонент, який постачає дані. Його використовують для обгортання частини компонентів, які мають отримувати доступ до значень Context. Provider приймає пропс value, який містить значення, яке буде доступне всім дочірнім компонентам, які споживають цей Context.

Consumer:
Consumer використовується для доступу до значень Context всередині компонентів. Він є функціональним компонентом, який отримує функцію, що приймає значення з Provider.

useContext Hook:
У сучасних функціональних компонентах, замість використання Consumer, можна скористатися хуком useContext, який дозволяє зручніше отримувати доступ до значень Context.

Для чого використовувати React Context?

React Context використовується для:

Передачі даних (наприклад, теми, мови, поточного користувача) глибоко в ієрархію компонентів без необхідності пропс-дрилінгу (передачі через пропси).

Управління глобальним станом невеликих додатків.

Спільного використання стану між компонентами, які знаходяться на різних рівнях ієрархії.