How to properly access Redux store in the React component?

Question

I'm working on React frontend, currently have working backend. I would like to display server-side messages during login, besides client-side validation, like if all fields are filled. I'm having troubles with accessing Redux store in my component, even though I've wrote mapStateToProps function and as I've read, values returned from an action should be mapped to props, so I should be able to retrieve them. My code: https://codesandbox.io/s/rough-firefly-4kcdl (I'm sorry for syntax error regarding an arrow function). As you can see on the attached screenshot, there are some values in Redux store, and I would like to be able to use some of them in coresponding component.

Maiko Morales Roman · Accepted Answer · 2019-08-08 01:29:10Z

1

In your auth reducer case LOGIN_FAILURE your new state has a different structure, instead of returning { action } return { ...state, errors: action.errors, isLoading: action.isLoading } because that's what your component is expecting

edited Aug 8, 2019 at 1:29

answered Aug 6, 2019 at 17:02

Maiko Morales Roman

1063 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ahmad Noor · Accepted Answer · 2019-08-06 17:36:13Z

1

Hey i have share a link with you where i have defined how you can use mapStateToProps and mapDispatchToProps in mostly used pattern

https://codesandbox.io/s/cool-oskar-oj4s4?fontsize=14

in your reducers please change your Login_Failure case return statement. you have to return all the remaining state to component because reducer always return state object

 return {
   ...state
  }

and check you Login component i have defined proper way to get updated state and dispatch your actions you can get your state with your reducers name

answered Aug 6, 2019 at 17:36

Ahmad Noor

1498 bronze badges

Collectives™ on Stack Overflow

How to properly access Redux store in the React component?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related