Having trouble with the ternary operator while creating private route in React

Question

I'm following an online course and creating a private route component that redirects users based on an isAuthenticated state, I logged the state and it returned the else part even though the state was true.

  <Route
    {...rest}
    render={props =>
      isAuthenticated === true ? (
        <Redirect to="/login2" />
      ) : (
        <Redirect to="/login3" />
      )
    }
  />

it redirects to login3 even if the state is true.

It it true immediately or is there some asynchronous stuff happening? — Brian Thompson
if have "isAuthenticated" state available from props, change your code as below <Route {...rest} render={props => props.isAuthenticated === true ? ( <Redirect to="/login2" /> ) : ( <Redirect to="/login3" /> ) } /> — user2063635
They only refer to isAuthenticated as being state, not props. If that indeed is the issue, please read up on the difference here. — Brian Thompson

AryanNigam AryanNigam · Accepted Answer · 2021-04-20T22:46:37

From where are you getting isAuthenticated ? Is it a props or are you using redux?

If it props then write props.isAuthenticated it will work

Having trouble with the ternary operator while creating private route in React

1 Answers