reactjs：无法使路由器工作

Question

我有以下 index.html。我正在尝试使用路由器。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>Twitter API</title>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>
  <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/react-router-dom/4.2.2/react-router-dom.min.js"></script>
  </head>

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

  <script type="text/babel">

    class Module extends React.Component {
      constructor(props) {
          super(props);
      }

      render() {
          return (
            <div>
            <p>This is Module</p>
            </div>

          );
        }
      }

  class Basic extends React.Component {
      constructor(props) {
        super(props);
      }
      render() {
        return (
          <ReactRouterDOM.Router>
            <ReactRouterDOM.Route exact path="/" component={Module} />
          </ReactRouterDOM.Router>
          )
      }
    }

  ReactDOM.render(
      <Basic />,
      document.getElementById('root')
  );
  </script>
  </body>
</html>

我收到以下错误：如何解决这个问题

Uncaught TypeError: Cannot read property 'location' of undefined
    at new n (react-router-dom.min.js:1)
    at react-dom.js:4749
    at measureLifeCyclePerf (react-dom.js:4529)
    at ReactCompositeComponentWrapper._constructComponentWithoutOwner (react-dom.js:4748)
    at ReactCompositeComponentWrapper._constructComponent (react-dom.js:4734)
    at ReactCompositeComponentWrapper.mountComponent (react-dom.js:4642)
    at Object.mountComponent (react-dom.js:11542)
    at ReactCompositeComponentWrapper.performInitialMount (react-dom.js:4825)
    at ReactCompositeComponentWrapper.mountComponent (react-dom.js:4712)
    at Object.mountComponent (react-dom.js:11542)

Answer 1

您需要使用 BrowserRouter 并且如果您的页面不是运行来自根目录（ 和你想使用 / 路径)

  <ReactRouterDOM.BrowserRouter basename="/~user/">
    <ReactRouterDOM.Route exact path="/" component={Module} />
  </ReactRouterDOM.BrowserRouter>

reactjs：无法使路由器工作

reactjs: not able to make router work

reactjs

react-router-dom