javascript - 渲染 React.Component

Question

有人可以指出这段使用 React 渲染组件的代码有什么问题吗？它不断抛出错误，提示“元素类型无效...检查应用程序的渲染方法”，但我看不到问题。

import React from 'react';
import ReactDOM from 'react-dom';   
import App from './components/app';

ReactDOM.render(<App />, document.getElementById('container'));

应用程序

import React from 'react';
import AppActions from '../actions/app-actions';
import Catalog from './app-catalog';

export default class App extends React.Component {
 render(){
    return (
        <div className="container">
            <Catalog />
        </div>
    )   
 }
}

目录

import React from 'react';
import AppStore from '../stores/app-store';
import CatalogItem from './app-catalog-item';

function getCatalog(){
 return {items: AppStore.getCatalog()}
};

class Catalog extends React.Component {
 constructor(){
    super();
    this.state = getCatalog();
 }
 render(){
    let items = this.state.items.map(item => {
        return <CatalogItem key={item.id} item={item} /> 
    });
    return (
        <div className="row">
            {items}
        </div>
    )    
 }
}

任何帮助将不胜感激。

Answer 1

您只需在目录中导出默认内容即可:

export default class Catalog extends React.Component {
...

否则，当您使用 import 语句时，不会导入任何内容:

import Catalog from './app-catalog';