Шпаргалка по React Context

Проблема: props drilling — пробрасывания данных через props вниз по дереву элементов.

Решение: React Context

Создаем контекст:
export const LocaleContext = React.createContext();

Прокидываем данные:
<LocaleContext.Provider value={data}>
<ComponentA />
</LocaleContext.Provider>

Используем данные:
const data = React.useContext(LocaleContext);

До хука useContext данные использовали так:
<LocaleContext.Consumer>
{(data) => {return (… )}}
</LocaleContext.Consumer>

--

--