React-router：TypeError：无法设置undefined的属性'props' [英] React-router: TypeError: Cannot set property 'props' of undefined

问题描述

我正在尝试使用 react-router 包在 Meteor 中设置路由并遇到以下 TypeError ：

I am trying to set up routing in Meteor using react-router package and have encountered the following TypeError:

链接到图片： https://postimg.org/image/v0twphnc7/

我用的代码 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>
    );
}

但是当我从Component扩展它时会出现错误：

But when I extend it from the Component is where the error comes in:

class Portfolio extends Component () {
  render() {
    return (
        <div>Portfolio page</div>
    );
  }
}

请解释一下可能存在的差异normal和类组件以及出现以下错误的原因。

Can you please explain the possible difference between "normal" and class component and why the following error appears.

推荐答案

假设您要导入组件作为 React.Component 正确地，尝试删除Component之后的括号。

Assuming you are importing Component as a React.Component correctly, try removing the parenthesis after Component.

应该是：

class Portfolio extends Component {

而不是：

class Portfolio extends Component () {

如果没有，请将 Component 替换为 React.Component 。

If not, replace Componentwith React.Component.

这篇关于React-router：TypeError：无法设置undefined的属性'props'的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！