React Redux：道具更改时，从ACTION重新加载组件

Question

This is my component's class:

import React, { Component }           from 'react';
import {connect}                      from 'react-redux';
import Button                         from '../UI/Button/Button';
import * as actions                   from '../../store/actions';

class Password extends Component {

    submitPassword=(e)=>{   
        e.preventDefault();
        this.props.submitPassword(this.state.password, this.props.levelNumber);
    }


    render() {        
        <Button clicked={this.submitPassword} >
            Submit password
        </Button>
    }

}
const mapStateToProps = state => {
    return {

    };
}
const mapDispatchToProps = dispatch => {
    return {
        submitPassword: (password,levelNumber) =>  dispatch(actions.submitPassword(password,levelNumber))
    };
}

export default connect(mapStateToProps, mapDispatchToProps)(Password);

and this is my action:

export const submitPassword = () => {

    // HERE ALL MY LOGIC !!!

    return {
        level:undefined,
        type:actions.PASSWORD
    }
}

The code working all correctly including params and logic.
I wanna that every time that finish to execute the function submitPassword A THIRD COMPONENT refresh/reload with the new props.
It's possibile to send a command from action to component? How can I do it?
I have already tried with:

componentWillReceiveProps() {
    console.log("new props");
}

in my component but he can not take the event.

Answer 1

If your component has props it will rerender when a prop change. If you want a page reload (location.reload()) you are going to need to add a Middleware (like redux sagas) in order to handle that. This is because actions are asynchronous.

Answer 2

To be able to act on updated props your component will have to "watch" the props thats being changed. Without seeing your redux store I don't know what you want to accomplish but you should be able to add it to your:

const mapStateToProps = state => {
    return {
        desiredProp: state.desiredProp
    };
}

and then in your class you can reach this by console.log(this.props) assuming your redux is setup correctly.