Это вторая часть Когда использовать useContext()?
В предыдущей статье объяснялось, почему необходимо использовать ContextAPI. Здесь мы больше сосредоточимся на реализации ContextAPI.
Использование контекста состоит из трех частей.
- Создайте контекст. (Я назову его UserFormContext, так как это форма для создания пользователя)
2. Используйте этот контекст из компонента, которому нужны данные. (InputName будет использовать UserFormContext*)
*InputName вместо BottomLineInput использует контекст, поскольку BottomLineInput может использоваться в другом контексте.
3. Предоставьте этот контекст из компонента, который указывает данные. (Приложение предоставит UserFormContext)
Как видите, в коде нет «бурения пропеллеров». Даже если дочерний компонент будет дальше от родительского компонента при поддержке кода, не будет необходимости в передаче реквизитов.
Эмпирическое правило обработки состояния заключается в использовании локального состояния, если это возможно, и поднятии состояния вверх. Это сохраняет кодовую базу чистой и эффективной. Однако современные веб-приложения сложны, и при необходимости лучше использовать контекст.
В следующей статье я расскажу о реализации с помощью useReducer(), чтобы использовать контекст, больше похожий на Redux или другие библиотеки управления состоянием.
