嵌套的React路由器未定义的子打印

时间:2017-10-27 21:31:54

标签: reactjs react-router react-router-v4

我正试图限制路线进入。它被阻止,但当我登录那些网址组件不打印或我试图打印的孩子不打印任何想法为什么? this.props.children值未定义我想阻止的网址被阻止。

RequireAuth.js

import React from 'react';
import { withRouter } from 'react-router';
import { createBrowserHistory } from 'history';


let isLoggedIn

const history = createBrowserHistory();

class RequireAuth extends React.Component {

    componentWillMount() {
        isLoggedIn = localStorage.getItem("token");
        this.checkAuth();
        console.log(this.props, "Hello", this.props.children)
    }

    checkAuth() {

        if (!isLoggedIn) {
            history.push(`/#/SignIn`);
        }
        window.location.reload();

    }


    render() {

        return(
            let RouteChildren = 

React.cloneElement(this.props.children)
        return(
            {RouteChildren}
    )
        )
    }
}


export default withRouter(RequireAuth);

路线我试图将条件置于

<Router onUpdate={ () => window.scrollTo(0, 0) }>
                <div className="app">
                    <Switch>


                        <Route exact path="/LogOut" component={LogOut} />

                        <Route component={RequireAuth} >
                            <Route exact path="/HomeProfile" component={HomeProfile} />
                            <Route exact path="/HomeProfile/HomePictures" component={HomePictures} />
                            <Route exact path="/HomeProfile/HomeRecord" component={HomeRecord} />
                            <Route exact path="/HomeProfile/HomeSystems" component={HomeSystems} />
                            <Route exact path="/Rewards" component={Rewards} />

                            <Route exact path="/Settings/ChangePassword" component={ChangePassword} />

                            <Route exact path="/Settings/Notification" component={Notification} />
                        </Route>


                    </Switch>
                </div>
            </Router>

0 个答案:

没有答案