Question

我正在尝试使用react-router实现简单身份验证。我认为替换和回调存在问题。请考虑以下代码：

1）路由配置

function getRoutes() {
    return {
        path: "/",
        indexRoute: require("./Home"),
        component: require("./Shared/Layout"),
        onEnter: handleEnter,
        childRoutes: [
            require("./Login"),
            require("./Secured"),
            require("./Any")
        ]
    }
}

function handleEnter(nextState, replace, callback) {
    let state = store.getState()

    if (!state.hasIn(["shared", "user"])) {
        store.dispatch(fetchUser())
            .then(callback)
    }
}

2）./Secured路线配置

export = {
    path: "/secured",
    component: require("./Secured"),
    onEnter(nextState, replace) {
        let state = store.getState()

        if (!state.getIn(["shared", "user"])) {
            replace("/login")
        }
    }
}

它应该像这样工作：

在输入根路由时获取用户（异步操作，我们需要回调）
转到/secured并检查用户在输入路线时是否经过身份验证
如果用户未经过身份验证，请转到/login

问题是不会呈现/login页面。 URL更改为/login，但未显示任何内容，并且控制台中没有错误消息。当我从根路由配置中删除callback参数时，它会按预期开始工作。

我做错了吗？

Answer 1

嗯，这真的很愚蠢:)当用户已经过身份验证时，我忘了给callback打电话。

调用时未呈现的组件＆＃34;替换＆＃34;在onEnter

1 个答案: