Question

尝试在我的应用程序中使用嵌套组件似乎打破了我的反应应用程序。

使用以下代码，应用程序可以正常加载：

import React from 'react';

const Manage = props => (
  <div>
    <span>Hello World!</span>
  </div>
)

export default Manage

但是当我尝试将一个Material-UI compoenet添加到页面时，应用程序编译但拒绝加载，抛出以下错误：

warning.js：33警告：React.createElement：type无效 - 期望一个字符串（对于内置组件）或类/函数（对于复合组件）但得到：undefined。您可能忘记从其定义的文件中导出组件。

import React from 'react';
import {Card, CardHeader, CardText} from 'material-ui/Card';

const Manage = props => (
  <div>
    <Card>
        <CardHeader
          title="Without Avatar"
          subtitle="Subtitle"
          actAsExpander={true}
          showExpandableButton={true}
        />
        <CardText expandable={true}>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit.
          Donec mattis pretium massa. Aliquam erat volutpat. Nulla facilisi.
          Donec vulputate interdum sollicitudin. Nunc lacinia auctor quam sed pellentesque.
          Aliquam dui mauris, mattis quis lacus id, pellentesque lobortis odio.
        </CardText>
    </Card>
  </div>
)



export default Manage

Answer 1

您的卡导入错误。 Card组件是默认导出，而不是命名导出。把它改成这样的东西：

import Card, {CardHeader, CardText} from 'material-ui/Card'

材料UI组件破坏React应用程序

1 个答案: