# Chapter 13 of Learning React Problem with React Router

**URL:** <https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674>\
**Category:** Uncategorized\
**Created:** [December 19, 2016, 3:10am UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674 "2016-12-19T03:10:32Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Salvator\_Sahagun](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/salvator_sahagun/32/7897_2.png) [@Salvator\_Sahagun](https://forum.kirupa.com/u/Salvator_Sahagun)\
**Post date:** [December 19, 2016, 3:10am UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/1 "2016-12-19T03:10:33Z")

</div>

My code works perfectly fine with this code.

```javascript
ReactDOM.render(
<div>
   <App/>
</div>,
destination
);

```

However when I proceed to set up the React Router.

```javascript
ReactDOM.render(
  <ReactRouter.Router>
        <ReactRouter.Route path ="/" component={App}>

        </ReactRouter.Route>
  <ReactRouter.Router>,
destination
);

```

Once I load the document in Google Chrome. Dev Tools gives me the following error.

Uncaught TypeError: Cannot read property ‘getCurrentLocation’ of undefined  
at Constructor.createTransitionManager (ReactRouter.min.js:1)  
at Constructor.componentWillMount (ReactRouter.min.js:1)  
at react.js:6244  
at measureLifeCyclePerf (react.js:5971)  
at ReactCompositeComponentWrapper.performInitialMount (react.js:6243)  
at ReactCompositeComponentWrapper.mountComponent (react.js:6154)  
at Object.mountComponent (react.js:13768)  
at ReactCompositeComponentWrapper.performInitialMount (react.js:6267)  
at ReactCompositeComponentWrapper.mountComponent (react.js:6154)  
at Object.mountComponent (react.js:13768)

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [December 19, 2016, 4:58am UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/2 "2016-12-19T04:58:27Z")

</div>

Does your full code look like the following:

```
<!DOCTYPE html>
<html>
<head>
  <title>React Test</title>
  <script src="https://unpkg.com/react@15.3.2/dist/react.js"></script>
  <script src="https://unpkg.com/react-dom@15.3.2/dist/react-dom.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.23/browser.min.js"></script>
  <script src="https://npmcdn.com/react-router@2.4.0/umd/ReactRouter.min.js"></script>

  <style>

  </style>
</head>

<body>
  <div id="container"></div>

<script type="text/babel">
  var destination = document.querySelector("#container");

  var App = React.createClass({
    render: function() {
      return (
        <div>
          <h1>Simple SPA</h1>
          <ul className="header">
            <li>Home</li>
            <li>Stuff</li>
            <li>Contact</li>
          </ul>
          <div className="content">

          </div>
        </div>
      )
    }
  });

  ReactDOM.render(
    <ReactRouter.Router>
      <ReactRouter.Route path="/" component={App}>

      </ReactRouter.Route>
    </ReactRouter.Router>,
    destination
  );
</script>
</body>

</html>

```

I am at the exact step you are, and I don’t see the error that you are seeing.

---

<div class="post-metadata">

**Author:** ![Salvator\_Sahagun](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/salvator_sahagun/32/7897_2.png) [@Salvator\_Sahagun](https://forum.kirupa.com/u/Salvator_Sahagun)\
**Post date:** [December 19, 2016, 7:43am UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/3 "2016-12-19T07:43:01Z")

</div>

Thank you; The print edition of your book doesn’t include “react-router@2.4.0/” it was simply  
"react-router"

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [December 19, 2016, 5:06pm UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/4 "2016-12-19T17:06:42Z")

</div>

Yikes! That is a bug that needs to be fixed.

---

<div class="post-metadata">

**Author:** ![renright](https://avatars.discourse-cdn.com/v4/letter/r/838e76/32.png) [@renright](https://forum.kirupa.com/u/renright)\
**Post date:** [April 18, 2017, 5:44pm UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/5 "2017-04-18T17:44:47Z")

</div>

It works to change that react-router however I get this error code:

react.js:20478 Warning: You are manually calling a React.PropTypes validation function for the `component` prop on `Route`. This is deprecated and will not work in the next major version. You may be seeing this warning due to a third-party PropTypes library. See [https://fb.me/react-warning-dont-call-proptypes](https://fb.me/react-warning-dont-call-proptypes) for details.  
printWarning @ react.js:20478  
react.js:20478 Warning: You are manually calling a React.PropTypes validation function for the `components` prop on `Route`. This is deprecated and will not work in the next major version. You may be seeing this warning due to a third-party PropTypes library.  
printWarning @ react.js:20478  
react.js:20478 Warning: You are manually calling a React.PropTypes validation function for the `getComponent` prop on `Route`. This is deprecated and will not work in the next major version. You may be seeing this warning due to a third-party PropTypes library.  
printWarning @ react.js:20478  
react.js:20478 Warning: You are manually calling a React.PropTypes validation function for the `getComponents` prop on `Route`. This is deprecated and will not work in the next major version. You may be seeing this warning due to a third-party PropTypes library. See [https://fb.me/react-warning-dont-call-proptypes](https://fb.me/react-warning-dont-call-proptypes) for details.

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [April 18, 2017, 7:53pm UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/6 "2017-04-18T19:53:47Z")

</div>

The version or React Router the book talks about has been replaced by a newer version. That’s why you are seeing these warnings. The warnings are OK for now, but you will need to update to a newer version of the Router. I haven’t had a chance to update it yet either, but I’ll do so and post an updated tutorial shortly 🙂

---

<div class="post-metadata">

**Author:** ![kdglauvygiadn](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kdglauvygiadn/32/12570_2.png) [@kdglauvygiadn](https://forum.kirupa.com/u/kdglauvygiadn)\
**Post date:** [October 3, 2020, 7:11pm UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/7 "2020-10-03T19:11:48Z")

</div>

I tried the your very code(copy & past) in my visual studio code and still it didn’t work.

 ![errorsnippet](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/2X/9/95abe4a68d67ba3339bdc79a14eb2372af23abb0.jpeg)

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [October 4, 2020, 6:33am UTC](https://forum.kirupa.com/t/chapter-13-of-learning-react-problem-with-react-router/635674/8 "2020-10-04T06:33:42Z")

</div>

Can you post your full source code?