反应路由器:无法读取未定义的属性“路径名"

问题描述：

我刚刚开始学习React并陷入了这个错误.

I've just started learning React and got stuck at this error.

未捕获的TypeError:无法读取未定义的属性'pathname' 在新路由器上

Uncaught TypeError: Cannot read property 'pathname' of undefined at new Router

这是我的代码:

var React = require('react');
var ReactDOM = require('react-dom');
var { Route, Router, IndexRoute } = require('react-router');
var hashHistory = require('react-router-redux')

var Main = require('./components/Main');

ReactDOM.render(
    <Router history={hashHistory}>
        <Route path="/" component={Main}>

        </Route>
    </Router>,
  document.getElementById('app')
);

我遵循的教程使用React-Router 2.0.0，但是在我的桌面上，我使用的是4.1.1.我尝试搜索更改，但未找到有效的解决方案.

The tutorial I was following uses React-Router 2.0.0, but on my desktop I'm using 4.1.1. I tried searching for changes but was unsuccessful in finding a solution that worked.

"dependencies": {
"express": "^4.15.2",
"react": "^15.5.4",
"react-dom": "^15.5.4",
"react-router": "^4.1.1",
"react-router-dom": "^4.1.1",
"react-router-redux": "^4.0.8"

答

该错误是因为React Router v4中的api完全不同. 您可以尝试以下方法:

The error is because the api in React Router v4 is totally different. You can try this:

import React from 'react';
import ReactDOM from 'react-dom';
import {
  BrowserRouter as Router,
  Route
} from 'react-router-dom';

const Main = () => <h1>Hello world</h1>;

ReactDOM.render(
  <Router>
    <Route path='/' component={Main} />
  </Router>,
  document.getElementById('app')
);

您可以查看文档，以了解其现在的工作原理.

You can review the documentation to learn how it works now.

此处我有一个带有路由动画的仓库.

Here I have a repo with routing animation.

在此处，您可以找到实时演示.

And here you can find a live demo.

反应路由器:无法读取未定义的属性“路径名"

相关推荐