Skip to main content

Provide the store

To provide the store you just created to all your app, import the StoreProvider component from async-redux-react and wrap your app with it.

Note your code should have a single store provider, at the top of your component tree.

Then, pass the store as a prop to the StoreProvider.

index.tsx
import React from "react";
import ReactDOM from "react-dom/client";
import App from "./App";

const rootElement = document.getElementById("root")!;
const root = ReactDOM.createRoot(rootElement);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);
App.tsx
import React from "react";
import { createStore, StoreProvider } from "async-redux-react";
import State from "./State";

const store = createStore<State>({ initialState: ... });

function App() {
  return (
    <StoreProvider store={store}>
      <AppContent />
    </StoreProvider>
  );
};

Try it out​

Next, let's see how to access the store's state from any component.