Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Property history does not exist

I am trying to kick off a new project using React and TypeScript, one of the things I stuck with is Router, for some reason TypeScript does not acknowledge history property, though it should be available according to the documentation.

My component

import * as React from 'react'
import * as ReactDom from 'react-dom'
import { Provider } from 'react-redux'
import { BrowserRouter as Router} from 'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory'

let history = createBrowserHistory();

ReactDom.render(
    <Provider>
        <Router history={history} > {/* Error is in this line */}
            <div />
        </Router>
    </Provider>,
    document.getElementById('app')
);

Error message:

Error:(11, 11) TS2339:Property 'history' does not exist on type 'IntrinsicAttributes 
& IntrinsicClassAttributes<BrowserRouter> & Readonly<{ children?: ReactNode; ...'.

How can I make it work?

like image 817
SmxCde Avatar asked Oct 27 '17 21:10

SmxCde


1 Answers

if you are using react-router-v4

You can not pass a history to a <BrowserRouter>, as it creates its own history object

If you are creating your own history Object use <Router> instead of <BrowserRouter> and then pass history object

import { Router } from 'react-router-dom'
<Router history={history}> <Router/>

You can read more on history in react-router-v4

like image 56
Aaqib Avatar answered Oct 21 '22 15:10

Aaqib