Javascript 反应路由器：类型错误：无法设置未定义的属性“道具”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/38484490/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
React-router: TypeError: Cannot set property 'props' of undefined
提问by volna
I am trying to set up routing in Meteorusing react-routerpackage and have encountered the following TypeError:
我正在尝试在Meteorusingreact-router包中设置路由并遇到以下情况TypeError：
Link to image: https://postimg.org/image/v0twphnc7/
图片链接：https: //postimg.org/image/v0twphnc7/
The code in I use in main.js
我使用的代码 main.js
import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, browserHistory } from 'react-router';
// Importing components
import App from './components/app';
import Portfolio from './components/portfolio/portfolio';
//Creating a route
const routes = (
<Router history={browserHistory}>
<Route path='/' component={App}>
<Router path='portfolio' component={Portfolio} />
</Route>
</Router>
);
// Loading routes
Meteor.startup(() => {
ReactDOM.render(routes, document.querySelector('.universe'));
});
The problem that I've managed to identify is that when I define portfolio as a Simple Component it works.
我设法确定的问题是，当我将投资组合定义为简单组件时，它会起作用。
const Portfolio = () => {
return (
<div className='red'>Portfolio page</div>
);
}
But when I extend it from the Component is where the error comes in:
但是当我从 Component 扩展它时，错误就出现了：
class Portfolio extends Component () {
render() {
return (
<div>Portfolio page</div>
);
}
}
Can you please explain the possible difference between "normal" and class component and why the following error appears.
你能解释一下“正常”和类组件之间可能的区别，以及为什么会出现以下错误。
回答by kctang
Assuming you are importing Componentas a React.Componentcorrectly, try removing the parenthesis after Component.
假设您正在导入Component的React.Component正确，尽量组件后去除括号。
Should be:
应该：
class Portfolio extends Component {
instead of:
代替：
class Portfolio extends Component () {
If not, replace Componentwith React.Component.
如果没有，请替换Component为React.Component。
回答by Axiom_shuvo
The answer provided by kctang is right, that
use :
kctang 提供的答案是正确的，即
使用：
class Portfolio extends Component {
instead of:
代替：
class Portfolio extends Component () {}
I wanna add the cause of it ?? In object-oriented programing it's called inheritance, when you extend/inherit a class to use its component, you called by its name and it's not function. here you extend Component class not function, that's why you don't use parenthesis and also function need a parameter.
我想添加它的原因？在面向对象的编程中，它被称为继承，当您扩展/继承一个类以使用其组件时，您会通过它的名称而不是函数来调用它。在这里你扩展 Component 类而不是函数，这就是为什么你不使用括号并且函数也需要一个参数。
