CODEWITHSUNDEEP
reactjstypescriptreact-router
blankface
blankface

Reputation: 6347

Type error on React Route component

I'm trying to use the route Route component but it's throwing the following error:

[ts] Type '{ path: "/:shortname"; component: typeof FirstComponent; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly<{ children?: ReactNode; }> & Rea...'.

Here's my route config:

import { BrowserRouter as Router, Route, Link } from 'react-router-dom';

<Router>
    <Link to='/customer'></Link>
    <Route path='/:shortname' component={FirstComponent} />
</Router>

These are the versions I'm using:

"@types/react-router-dom": "^4.0.5"
"react-router-dom": "^4.1.1"

Upvotes: 2

Views: 2105

Answers (1)

Allen
Allen

Reputation: 4759

Alright, the problem is that <Router/> element only accepts single child. While your children for Router is an array of Link & Route.

Try wrap your Link and Routes with div or even fancier React.Fragment (after react 16.2+)

<Router>
  <React.Fragment>
    <Link to='/customer'></Link>
    <Route path='/:shortname' component={FirstComponent} />
  </React.Fragment>
</Router>

Upvotes: 3

Related Questions