history.replace()在auth0类和react-router v4中不起作用

时间:2019-04-21 16:03:04

标签: javascript reactjs react-router auth0 history.js

history.replace()在auth0类中不起作用

//src/history.js

import { createBrowserHistory } from 'history';

export default createBrowserHistory();

然后,我尝试将其导入到我的Auth0类中以使用history.replace()。这是该类中的两个函数,以及我如何尝试使用此函数。

//components/Auth.js

handleAuthentication() {
        this.auth0.parseHash((err, authResult) => {
            if (authResult && authResult.accessToken && authResult.idToken) {
                this.setSession(authResult);
            } else if (err) {
                console.log(err);
                alert(`Error: ${err.error}. Check the console for further details.`);

                location.hash = "";
                //location.pathname = "/";
                history.replace("/");
            }
        });
    }

    setSession(authResult) {
        // Set isLoggedIn flag in localStorage
        //localStorage.setItem('isLoggedIn', 'true');

        // Set the time that the access token will expire at
        let expiresAt = JSON.stringify((authResult.expiresIn * 1000) + new Date().getTime());

        localStorage.setItem("access_token", authResult.accessToken);
        localStorage.setItem("id_token", authResult.idToken);
        localStorage.setItem("expires_at", expiresAt);

        location.hash = "";
        //location.pathname = "/dashboard";
        history.replace("/dashboard");

    }

我也在这里将历史记录作为道具添加到路由器中。

<Router history={history}>
            <Switch>
                <Route exact path="/" render={(props) => <Home auth={this.props.auth} {...props} />}/>
                <Route path="/dashboard" render={(props) => <Dashboard auth={this.props.auth} {...props} />}/>
                <Route path="/callback" render={(props) => <Callback auth={this.props.auth} {...props} />}/>
            </Switch>
</Router>

我已经阅读了用withRouter()包装一个组件的方法,但这似乎仅对组件有效,在这种情况下,我试图只使用一个类。

1 个答案:

答案 0 :(得分:-1)

运行控制台时是否看到任何错误?这似乎与Auth0没有直接关系,在调用该属性时,该属性在顶部居高不下。谢谢!