javascript - Redux - 我已经改变了我的状态，之后如何让事情发生？

Question

我正在用 redux 编写我的登录系统，我觉得我应该从更简单的东西开始我的第一个 redux :D

但是:

reducer

function application (state = initialState, action) {
    switch (action.type) {
        case 'LOGIN_REQUEST':
            return Object.assign({}, state, { loggedIn: true, shouldRedirect: true });
        case 'LOGGED_IN':
            return Object.assign({}, state, { loggedIn: true, shouldRedirect: true });
        case 'LOGIN_FAILED':
            return Object.assign({}, state, { loggedIn: false, shouldRedirect: false, errorMessage: action.error.message })
    }
    return state
}

操作

function receiveLogin(user) {
    return {
        type: LOGIN_SUCCESS,
        isFetching: false,
        isAuthenticated: true
    }
}

function loginError(message) {
    return {
        type: LOGIN_FAILURE,
        isFetching: false,
        isAuthenticated: false,
        message
    }
}

export function submitLogin (creds) {
    if(creds.email.length && creds.pw.length){
        return receiveLogin();
    }else{
        return loginError();
    }   
}

react

class SignIn extends React.Component {

    logIn = ( e ) => {
        console.info('as');
        e.preventDefault ();
        store.dispatch(authAction.submitLogin(this.state));
    };

    render = function () {
        return (
            <app-content class={loggedOut.home}>
                <Logo />
                <h1>Welcome to <br/> Kindred</h1>
                <h2>Please sign in to your account</h2>
                <form role="form" onSubmit={this.logIn}>
                    <input type="text" name="email" onChange={this.changed} component="input" placeholder="Enter email address"/>
                    <input type="password" name="pw" onChange={this.changed} component="input" placeholder="Password"/>
                    <button>Sign In</button>
                </form>
                <div className={loggedOut.extraDetails}>
                    <Link to="/signup">Don't have an account yet?</Link>
                    <Link to="/skip" className={loggedOut.extraDetailsRight}>Skip</Link>
                </div>
            </app-content>
        )
    }
};

因此LOGGED_IN状态发生变化。我到底如何将我的状态链接到将我转发到另一个页面？我不能在我的 reducer 中添加任何这样的逻辑，这些必须是纯粹的。但我需要将用户转发到另一个页面。我已经有了react-route，它有 HOC 来监视有或没有登录状态的人。但这仅在渲染时:/我无法将其添加到此逻辑中，因为这会触发查看的每个页面。

Answer 1

如果您的应用程序需要的话，您可以直接重定向，而不是在成功时触发操作。重定向不是 React 组件或 redux 操作。如果有的话，它可能是异步操作创建器的一部分。