How to access react-redux store outside of component

Question

I have file which exports various utility functions to use across components, and these functions needs to access redux state. How do I import the state object to this file?

Dudley

See Also: What is the best way to access redux store outside a react component? – Rosetterosewall

Answer 1

connect does not work here if your utility functions are not react elements.

Best idea is, import create store and then use getState function,

import store from 'store/createStore';
const state = store.getState();

Rib

I ended up just passing the necessary props to utility function from container component – Dudley

It gives only initial data of redux not updated. – Veld

Answer 2

Well, this isn't a simple answer, but after researching this for too long, I found these, which are the only 2 articles that explain anything. They explain how to access the store directly outside of a Component (if you must) and also mention the pure functions / functional programming philosophy as well as potential performance issues with connecting a bunch of non-component functions to the store directly. Personally, I went with @anoop and passed the params around in a single object as deeply as needed.

For connecting directly (which gets the store from this.context the way connect() does, see the discussion here and specifically gaearon's comment on Sep 16, 2015 and Sep 22, 2015. It seems this access can be achieved via connect()

For a little reading on functional programming / pure functions, see the discussion here

Uphold

Answer 3

The utility should get the state as an argument.

Because you want to use the utility in the components (views) you can store the state in a member variable on your smart component (the one using connect() function) via mapStateToProps(state) callback. then you can pass this member to your dumb components.

Perice

You'd have to pass the members to the utility EVERY time you want to use it, would be great if the utility can just access those members so we don't repeat code... – Boutis

Answer 4

Hi late for this post please take a look of my below code. Thanks

import { store } from "../../../redux/store";
// getting data from redux
const state = store.getState();
//i am fetching estimator data
const data = state.valuemodel.estimatorData;

Toothlike