重定向到另一条路是否意味着卸载?

时间:2018-04-25 06:16:02

标签: javascript node.js reactjs

我很反应并重定向到另一条路径并限制其他用户直接进入/main路径。我正在检查,if yes ..它会重定向......

因此,当我重定向时,它会重定向到/login页面,这会重定向两次。

现在,当我登录并填写我的凭据并获得令牌时,现在我设置的字段即yes,因为componentWillUnmount()未调用。

所以这意味着组件没有安装。因为我把所有凭据都正确,因为我说我是字段(验证是'是')然后流不会重定向到/main..它将被重定向到同一页/login并给出错误。

class Main extends Component { 

    constructor() {
        super();
        this.state = { userInfo: '', onlineUser: '', authenticate: 'no' };
    }

    async getUsers() {
        let user = await apiGateway.getUserInfo();
        alert(' did Mount1');
        alert(user);
        if(user == null) {
            this.setState({ authenticate : 'yes' });
            return;
        }
        else {
            this.setState({ userInfo : user.data });
        }
    }

    async setUpOnlineUsers() {
        let online = await apiGateway.getOnlineUsers();
        alert('did Mount2');
        if (online == null) {
            this.setState({ authenticate: 'yes' });
            return;
        } 
        else {
            this.setState({ onlineUser: online.data });
        }
    }

    async componentDidMount() {
        this.getUsers();
        this.setUpOnlineUsers();
    }

    async componentWillUnmount() {
        alert('unmount');
    }

    render() {
        const { authenticate } = this.state;
        alert(authenticate + ' render');

        if (authenticate === 'yes') {
            console.log('Redirect');
            return <Redirect to='/login' /> ;
        }
        const { userInfo } = this.state;
        const { onlineUser } = this.state;
        console.log(onlineUser);
        return (
            <div className='Main'>
                <div className='Main-header'>
                    <Header userInfo = {userInfo}/>
                </div>
                <div className='Main-chat'>
                    <Chat onlineUser = {onlineUser}/>
                </div>
                <div className="Main-container">
                    <Image imageArray = {imageArray}/>
                </div>
            </div>
        );
    }
}

export default Main;

** index.js **

 class App extends Component{

    render(){
        return(
            <Router>
                <div>
                    <Route path ='/login' component={Login}/>
                    <Route path = '/register' component={Register}/>
                    <Route path = '/' component={Main}/>
               </div>
            </Router>
            );
    }
 }

 export default App;

0 个答案:

没有答案