CODEWITHSUNDEEP
reactjsreact-routerreact-router-dom
firasKoubaa
firasKoubaa

Reputation: 6867

Failed prop type: Invalid prop `to` supplied to `Redirect`

My app.js looks like this :

export default function App() {
  return (
    <BrowserRouter>
      <Switch>
        <Route path="/auth" component={AuthenticationLayout} />
        <Route path="/dash" component={DashboardLayout} />

        <Route exact path="/" render={() => (
          <Redirect to={AuthenticationLayout} />
        )}/>
      </Switch>
    </BrowserRouter>
  );
}

Cant't undersatnd what's the problem

Suggestions ?

Upvotes: 0

Views: 315

Answers (2)

le123
le123

Reputation: 180

Redirect is a navigate to a new location, to accept the URL to redirect to, you can write like this:

<Route exact path="/" render={() => (
      <Redirect to="/auth" />
    )}/>

Upvotes: 1

Rohan Agarwal
Rohan Agarwal

Reputation: 2609

The to prop in Redirect accepts either a string, which is the route you want to navigate to, or an object which can contain properties like pathname, state, etc.

Ex (from the docs) :

<Redirect
  to={{
    pathname: "/login",
    search: "?utm=your+face",
    state: { referrer: currentLocation }
  }}
/>

So, when you are trying to pass a component to the prop to, you get an error.

Correct implementation is:

<Redirect to="/auth" />

Upvotes: 0

Related Questions