How to use a Provider inside a Provider? React / Redux

Question

I need to use an Main Provider to give some data to a React Route which is already wrapped in an Provider. Is the following syntax appropriate to use?

<Provider store={store}>
    <Router>
      <Routes>
        <Route path="/" element={<HomePage />} />
      </Routes>
    </Router>
    <Provider store={store2}>
      <Router>
        <Routes>
          <Route path="/about" element={<AboutPage />} />
        </Routes>
      </Router>
    </Provider>
    <Provider store={store3}>
      <Router>
        <Routes>
          <Route path="/review" element={<ReviewPage />} />
        </Routes>
      </Router>
    </Provider>
  </Provider>

And if it is approapriate how do I access the data from the main providers. Do I need to make another reducer for the first providers store?

Answer 1

In Redux, there are no concept of "parent" or "child" providers. Redux is made to have one store. Your "child provider" is just the new provider, overwriting the parent for all child components.

How to decide whats state i want from my 2 nested provider in react-redux