CODEWITHSUNDEEP
reactjsreact-redux
Jithesh Nair
Jithesh Nair

Reputation: 139

How to access store data in components using react-redux

I have two independent components called login and home. I have used mapStateToProps in login component to pass data. 

function mapStateToProps(state) {
  return { loginData: state.agent };
}

export default withRouter(connect(mapStateToProps)(login));

A button click from the login component will navigate us to the home page. I want to get and display all the 'loginData' values in the home component. I have tried this.props.loginData in home comp. But didn't get the store data. Any suggestions on this?

Upvotes: 0

Views: 2307

Answers (3)

Rohith Nair
Rohith Nair

Reputation: 1070

You can pass in data via state property

If you are using history.push

How to pass params with history.push in react-router v4?

similar with redirect

https://github.com/ReactTraining/react-router/blob/master/packages/react-router/docs/api/Redirect.md

Upvotes: 0

Praveen Rao Chavan.G
Praveen Rao Chavan.G

Reputation: 2860

To access the this.props.loginData in your homepage component, even there you need to use mapStateToProps like the way you have used in login component.

function mapStateToProps(state) {
  return { loginData: state.agent };
}

export default withRouter(connect(mapStateToProps)(homepage));

then you will able to access this.props.loginData

If you want to access the Redux store data in any component you need to use connect and make use of mapStateToProps to connect the store values to your props.

Upvotes: 1

Muljayan
Muljayan

Reputation: 3886

My suggestion would be to fire an action to fill the redux store with the details the user has entered after being logged in. After that can use mapStateToProps in the home page to get the details from the redux store.

Upvotes: 0

Related Questions