如何检查用户是否登录然后重定向？

Question

I have tried all answers I could find, this is my routing:

const loggedIn = !!localStorage.getItem('token');

const Routes = () => (
    <div>
        <Switch>
            <Route exact path="/" render={() => (
                !loggedIn ? (
                    <Redirect to="/login" />

                ) : (
                    <Redirect to="/welcome" />
                )
            )}/>
</Switch>
    </div>
);

export default Routes;

However, it is still not working.. I am getting an error on other container:

menuContainer.js:10 Uncaught TypeError: Cannot read property 'id' of null

constructor(props) {
        super(props);
        this.state = {
            userId: JSON.parse(localStorage.getItem('logged')).id,
            loginRole: localStorage.getItem('loggedRole')
        }
    };

What am I doing wrong here?

Thanks!

EDIT: I don't have any id if user is not logged in. That's the whole point. :) If user is not logged in, it should redirect back to /login.

Answer 1

首先，您需要在localStorage中设置项目

localStorage.setItem('name', value )

Answer 2

I'm not sure how do u set the localStorage object before.

var userobj = { id : 12 }

localStorage.setItem('logged',JSON.stringify(userobj))

then try getting it like JSON.parse(localStorage.getItem('logged')).id; //return 12 JSON.parse(localStorage.getItem('logged')).id; //return 12

This is how it needs to be done. If the token which u receive has the id, u have to manually set it before getting it :)