Что делать когда два React context зависят друг от друга?
В моём приложении есть два контекста: `SectionsContext` (управляет секциями меню) и `DishesContext` (управляет блюдами внутри секций). `DishesContext` использует текущее состояние выбранной секции из `SectionsContext`, поэтому я вложил `DishesProvider` внутрь `SectionsProvider`.
Однако возникла проблема: при удалении секции необходимо также удалять все её блюда. Но так как `DishesProvider` вложен в `SectionsProvider`, `SectionsContext` не может напрямую управлять `DishesContext`, что создаёт зависимость в обратном направлении.
Я рассматриваю три возможных решения:
1. Поднять состояние отвечающее за выбранную секцию на более высокий уровень.
2. Объединить оба контекста в один.
3. Использовать кастомный хук для синхронизации данных.
Какой из этих подходов чаще всего применяется на практике в подобных ситуациях? Или есть другие, более удачные решения?
А зачем тебе управлять блюдами из секций, если за это должен отвечать непосредственно контекст блюд? Ты и так используешь контекст секций в блюдах, так и удаляй все связанные блюда в эффекте, когда список секций изменяется. Но правильнее будет наоборот, отфильтровывать все блюда, чьих секций нет.
Спасибо за ответ.
Но компонент не примитивный. Использование контекстов необходимо. Я изначально использовал просто состояния и пропсы, но перешёл на контекст из-за того что пропс дриллинг стал слишком сложным.
Да и какая впринипе разница. Я ведь не про это спрашивал...
Так зачем мне доказывать тебе примитивный компонент или нет. Вопрос же не в том необходим мне контекст или нет. А в том как действовать когда мне необходимо использовать состояние из одного контекста в другом и наоборот.