CODEWITHSUNDEEP
reactjsredux
user1543574
user1543574

Reputation: 863

Why use "this.props.dispatch" rather than "store.dispatch" directly in Redux?

Is there any detriment to directly using store.dispatch?

It seems to me it's much easier to call (since it's available to all child components) and in my testing so far, I've yet to find a difference.

Thanks!

Upvotes: 36

Views: 28731

Answers (2)

Dan Abramov
Dan Abramov

Reputation: 268255

In universal apps, you'll want a different store instance on every request. If you just export store as a singleton from some module, you'll have a hard time adding server rendering.

This is why we never encourage singleton store in the docs, and always encourage you to use <Provider> to pass it down the hierarchy via React context. This makes store available to the consuming components without making it a singleton.

As for why connect() from React Redux passes dispatch as a prop instead of store itself—it's because you don't really need store itself in the connected components. Subscription and reading state is done by connect() so you'll only ever need dispatch() in components.

Upvotes: 60

J3Y
J3Y

Reputation: 1853

Usually I find that the store is initialized in a top level module, and then used in lower level modules by the react-redux connect function.

This prevents the need to import the store directly in a lower level module, as it would be importing from the top level.

Upvotes: 2

Related Questions