Хороший способ применить несколько контекстов с React Hook

Question

В настоящее время у меня есть CategoryContext для управления состоянием категории, ModalContext для управления модальным состоянием.

<Layout>
   <ModalContext.Provider>
   <Route>
       <CategoryContext.Provider />
           <CategoryPage />
   </Route>
   <ModalContext.Provider />
</Layout>

Я просто перехожу из избыточности в ответную ловушку для управления состоянием. Тогда я не уверен, что мое решение хорошо или нет? Я рад получить больше идей из соц. :)

Answer 1

У вас может быть несколько провайдеров контекста, которые оборачивают компоненты, в которых вы хотите использовать контекст. Однако в вашем случае вы не оборачиваете компонент с провайдером, а просто отображаете его в случае CategoryContext

<Layout>
   <ModalContext.Provider>
   <Route>
       <CategoryContext.Provider >
           <CategoryPage />
       </CategoryContext.Provider >
   </Route>
   <ModalContext.Provider />
</Layout>