React Route Warning: Cannot update a component (`App`) while rendering a different component (`Context.Consumer`)

0
votes

I have privateRoute. When user is not signed in or email is not verified, redirect to modal login with warning. it is run by function show modal but i get error. it is work, by it is show this errror in dev. in prod i dont get this error.

warning:

index.js:1 Warning: Cannot update a component (App) while rendering a different component (Context.Consumer). To locate the bad setState() call inside Context.Consumer, follow the stack trace as described in in Route (at PrivateRoute.js:13) in PrivateRoute (at App.js:217) in Switch (at App.js:196) in Router (created by BrowserRouter) in BrowserRouter (at App.js:140) in div (at App.js:139) in App (at src/index.js:11) in Provider (at src/index.js:10)

code:

  <Route
  {...rest}
  render={(props) =>
    (user && user.providerId && user.providerId !== 'password') ||
    (user &&
      user.providerId &&
      user.providerId === 'password' &&
      user.emailVerified) ? (
      <Component {...props} />
    ) : (
      <Redirect to="/">{setLoginModalShow(true)}</Redirect>
    )
  }
/>

how i shoud do this corect please help

1
reactjsredirectreact-router

1 Answers

0
votes

Instead of calling setLoginModalShow(true) while redirecting, try below method, pass some flag as action while redirecting to homepage and on homepage check for that flag from router and use it to show login modal

<Redirect
  to={{
    pathname: "/",
    state: { action:  "showLogin" }
  }}
/>