阵营路由器V4：条件表达式不执行正确

操作系统：Windows 10 Pro的
阵营路由器：4.1.1
阵营：15.5.4阵营路由器V4：条件表达式不执行正确

所以，我做一个条件检查的<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> 
 
    ); 
 
    }

来源

2017-06-13 TheoG

我有同样的问题 – Man

重构代码如下解决了这个问题：

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

来源

2017-06-13 21:07:48 TheoG

阵营路由器V4：条件表达式不执行正确

回答

相关问题