Skip to content

Instantly share code, notes, and snippets.

@mdanshin
Last active May 3, 2023 06:41
Show Gist options
  • Save mdanshin/a32560926c69d06b33d427534abbf225 to your computer and use it in GitHub Desktop.
Save mdanshin/a32560926c69d06b33d427534abbf225 to your computer and use it in GitHub Desktop.
Пример использования контекста в React
import React, { createContext, useContext } from 'react';
// Создаем контекст со значением по умолчанию "default"
const MyContext = createContext('default');
// Создаем компонент, который получает значение контекста и отображает его в диве
function MyComponent() {
const value = useContext(MyContext);
return <div>{value}</div>;
}
// Создаем корневой компонент, который оборачивает MyComponent в провайдер контекста MyContext, передавая ему значение "Hello world"
function App() {
return (
<MyContext.Provider value="Hello world">
<MyComponent />
</MyContext.Provider>
);
}
@mdanshin
Copy link
Author

mdanshin commented May 1, 2023

В этом примере мы создали контекст MyContext со значением "default". Затем мы создали компонент MyComponent, который использует useContext для чтения значения контекста. В функции App мы использовали компонент Provider, чтобы передать значение "Hello world" в MyComponent.

Контекст также может быть использован для передачи функций и методов между компонентами. Это может быть полезно для создания функций, которые изменяют состояние всего приложения.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment