Accessing redux state

Hello fellow nerds, does anyone has an example of accessing redux state between components?

Unfortunately I’m not familiar much with Redux. But what is the issue, how it is usually done?

Funny thing is I’m fairly new to React and Redux :slight_smile: so I guess perhaps I am not applying best practice with my shallow understanding.

The good news is I managed to resolve it thanks to Framework7-redux. Thanks by the way for inquiring so promptly.

The main issue was getting access to the current copy of the Redux global state when you transition from one view component to the other or in between pages:

So although redux provides a useSelector hook to access the global state when the component is rendered for the first, the useSelector cannot be called from any other function except from a react component. This meant that I could detect the changed state of a reducer from any function.

Solution brief:
Having correctly setup Framework7-redux, passes a custom F7 reducer to the global store and then syncs up the global store to the stateKernel which is then imported and passed as a param to the App component.

This then exposes the stateKernel object(dispatch; subscribe, getState, replaceReducer) to any F7 react-component via the component props (i.e: app.passedParams.stateKernel).

So at this point, all I have to is to call the getState method to the latest copy of the global store. That also means I don’t even have to use the hooks provided by redux.

Sofar it works beautiful but my only concern is that Framework7-redux might not be maintained to catch up with future redux updates so I was very reluctant using it. But I had no choice having spent the last 3days trying to get this to work.

I might do a tutorial on this when I get some free time :slight_smile:

1 Like