Meteor
パッケージを使用してルーティングを設定しようとしていますreact-router
が、次のような問題が発生しました。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>
);
}
}
「通常」とクラス コンポーネントの違いと、次のエラーが表示される理由を説明してください。
ベストアンサー1
正しくインポートしているComponent
と仮定してReact.Component
、Component の後の括弧を削除してみてください。
正しくは:
class Portfolio extends Component {
の代わりに:
class Portfolio extends Component () {
そうでない場合は、Component
に置き換えますReact.Component
。