陣營路由器V4：條件表達式不執行正確

Question

操作系統：Windows 10 Pro的
陣營路由器：4.1.1
陣營：15.5.4

所以，我做一個條件檢查的<Route />確定authToken是否存在，以及它是否不重定向用戶登錄，否則渲染關聯的組件。但即使令牌存在，如圖中所示，如果您執行了根目錄/或/view/:postId的頁面重新加載，用戶仍會被重定向到登錄頁面。

我在這裏怎麼過分？

app.js

render() { 
 
    const SOME_PATH = window.location.pathname; 
 

 
    return (
 
     <ApolloProvider store={store} client={client}> 
 
     <Router history={history}> 
 
      <Route path={SOME_PATH} component={App}/> 
 
     </Router> 
 
     </ApolloProvider> 
 
    ) 
 
    }

App.js

export default compose(
 
    allPostsCommentsQuery, 
 
    connect(mapStateToProps, mapDispatchToProps) 
 
)(Main);

Main.js

render() { 
 
    const auth = this.props.auth.token; 
 
    console.log('auth = ', auth); 
 
    return (
 
     <div> 
 
     <h1> 
 
      <Link to="/">Flamingo City</Link> 
 
     </h1> 
 
     <Switch> 
 
      <Route path={`${this.props.match.url}`} exact render={(props) => (
 
      !auth ? <Redirect to="/login"/> : <PhotoGrid {...this.props} {...props} /> 
 
     )} /> 
 
      <Route path={`${this.props.match.url}view/:postId`} render={(props) => (
 
      !auth ? <Redirect to="/login"/> : <Single {...this.props} {...props} /> 
 
     )} /> 
 
      <Route path={`${this.props.match.url}login`} render={(props) => (
 
      <LoginUser {...this.props} {...props} /> 
 
     )} /> 
 
     </Switch> 
 
     </div> 
 
    ); 
 
    }

Answer 1

重構代碼如下解決了這個問題：

!auth ? (<Redirect to="/login"/>) : (<PhotoGrid {...this.props} {...props} />)