[React Router] Property 'history' is missing in type

エラー

Property 'history' is missing in type ...

対処法

シンプルなエラーです。

// 誤
<Route path="/" exact render={() => <TopPage hoge={hoge} />} />
// 正
<Route path="/" exact render={(props) => <TopPage {...props} hoge={hoge} />} />

解説

<Route path="/" exact component={TopPage} />

この書き方の時は、ReactRouterは、React.createElement時に route props (match, location, history) を渡してくれるが、

<Route path="/" exact render={(routeProps) => <TopPage {...routeProps} />} />

// {...hoge} は JSX Spread Attributes　で、下と同じ意味
<Route path="/" exact render={(routeProps) => <TopPage history={routeProps.history} location={routeProps.location} history={routeProps.history}  />} />

この書き方の時は、route props(match, location, history) を自分で渡さないといけない。

参考

Instead of having a new React element created for you using the component prop, you can pass in a function to be called when the location matches. The render prop receives all the same route props as the component render prop.