【问题标题】:React-router: TypeError: Cannot set property 'props' of undefinedReact-router:TypeError:无法设置未定义的属性'props'
【发布时间】:2016-11-23 21:08:27
【问题描述】:

我正在尝试使用react-router 包在Meteor 中设置路由并遇到以下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'));
});

我设法确定的问题是,当我将投资组合定义为简单组件时,它可以工作。

const Portfolio = () => {
    return (
        <div className='red'>Portfolio page</div>
    );
}

但是当我从组件扩展它时,错误就出现了:

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


能否请您解释一下“正常”和类组件之间可能存在的区别以及出现以下错误的原因。

【问题讨论】:

  • 不应该是 React.Component 除非你从 react 中单独导入组件。

标签: javascript meteor reactjs react-router


【解决方案1】:

假设您将 Component 正确导入为 React.Component,请尝试删除 Component 后面的括号。

应该是:

class Portfolio extends Component {

代替:

class Portfolio extends Component () {

如果不是,请将Component替换为React.Component

【讨论】:

  • 非常感谢!那很容易! :) facepalm
  • 为什么 > 组件 () 是什么意思?是不是因为那样它就像一个期待道具的函数?
  • 组件是一个类,这就是为什么
  • 非常感谢。我被这个问题困扰了一段时间。
猜你喜欢
  • 1970-01-01
  • 2021-10-19
  • 1970-01-01
  • 2021-01-15
  • 1970-01-01
  • 1970-01-01
  • 2019-07-22
  • 2020-01-10
  • 2020-06-22
相关资源
最近更新 更多