Question

我有以下代码：

let routes = 
        <Switch>
            <Route path="/" exact component={Authentication} />
            <Route path="/test" exact render = {props=> <Authentication/>} />
            <Redirect to="/" />
        </Switch>
        if(this.props.isLoggedIn){
            routes = 
                <>
                    <div className='mobile-header' onClick={this.handleNavBarShow}>
                        <p className="mobile-menu-icon">
                            <i className="fa fa-bars"></i>
                        </p>
                    <p>Title</p>
                    </div>
                    <NavBar toShow = {this.state.showMobileNavBar} 
                            onClicked = {(e)=>this.handleShowAndHide(e,true)}
                    />
                    <Switch>
                        <Route path ="/" exact render = {props=> <Authentication/>}/>   
                        <Route path ="/a" exact render = {props=> <Test1/>}/>
                        <Route path = "/b" exact render ={props =><Test2/>}/>
                        <Route path = "/c" exact render ={props =><Test3/>}/>

                        <Redirect to="/" />
                    </Switch>
                </>
        }
        return (
        <Router>
            <div className = "layout" onClick={(event)=>this.handleShowAndHide(event,false)}>
                {routes} 
                {showSideBar}         
            </div>
        </Router>
        )

问题是当 this.props.isLoggedIn === true 时，每当我尝试重新加载路由“/a”“/b”“/c”，或直接在地址栏中键入它时，它都会重定向到“/ “ 页。在 Test1 /Test2 /Test 3 组件中，彼此之间存在链接并且工作正常。当 this.props.isLoggedIn !== true 时，它也适用于重新加载和直接键入。可能是什么问题？

响应路由器在刷新时重定向到主页

0 个答案: