# useLocation and useHistory undefined in React Router

> Why do useLocation and useHistory return undefined in React Router? Because the Router wraps the same component using them, so move the Router one level up.

Author: Flavio Copes | Published: 2021-02-08 | Canonical: https://flaviocopes.com/react-router-uselocation-usehistory-undefined/

I was having some head scratching moment when using the `useLocation` and `useHistory` hooks with [React Router](https://flaviocopes.com/react-router/).

```js
const history = useHistory()
const location = useLocation()
```

They both returned `undefined`.

Turns out I was adding the Router to the DOM with `<Router>...</Router>` in the same component I was using `useLocation` and `useHistory`.

Then I found [this issue](https://github.com/ReactTraining/react-router/issues/7015) that explained I could not do that.

I had to move the `<Router>...</Router>` wrapping of my component one level up. In my case, I did that in the `index.js` file:

```js
import { BrowserRouter as Router } from 'react-router-dom'

...

ReactDOM.render(
  <React.StrictMode>

      <Router>
        <App />
      </Router>
  </React.StrictMode>,
  document.getElementById('root')
)
```