Search code examples
javascriptreactjsreduxreact-reduxreact-router-dom

How to reset values of react-redux?


I've been using the MERN stack.
I want to know how to reset values in redux values.
If I send incorrect data to backend /login route and I get 'Invalid email or password' and I save it redux. I see that in the front-end. When changing the route and after I change the route to the login (react) page I see this message. If I refresh the page redux reset.
I have a question how to reset value without refresh and change route?


Solution

  • What I got from your question is you want to clear the 'Invalid email or password' fro your redux store when you are switching from page a to page b.

    This is what you can do is you reset to '' your data in redux by creating and action and dispatch it on unmounting inside page a.

    something like this inside page a

    componentWillUnmount() {
      dispatch(resetErrorMessageAction())
    }
    

    Inside actions.js

    function resetErrorMessageAction(data) {
      return {
        type: 'RESET_ERROR_MESSAGE'
      }
    }
    

    Inside your reducer

    function(state, action) {
      switch(action.type) {
        case 'RESET_ERROR_MESSAGE':
          return {
            ...state,
            errorMessage: ''
          }
      }
    }