在 Material UI beta 中使用 CardContent 组件时出错答案

【问题标题】：Errors when using the CardContent component in Material UI beta在 Material UI beta 中使用 CardContent 组件时出错
【发布时间】：2017-12-30 13:45:40
【问题描述】：

我正在尝试从以前版本的 Material UI 迁移到新的 beta 版，但是这个错误让我抓狂。

简单地说，这可以正常工作，没有错误：

const Setup = () => {
  return (
    <div style={{ margin: '20px' }}>
      <Card>
        <CardHeader title="Let's get set up." />
      </Card>
    </div>
  );
};

export default Setup;

但这不是：

const Setup = () => {

  return (
    <div style={{ margin: '20px' }}>
      <Card>
        <CardHeader title="Let's get set up." />
        <CardContent>
        </CardContent>
      </Card>
    </div>
  );
};

export default Setup;

以下是产生的错误：

【问题讨论】：

你用的是什么版本？
</div>http://i.imgur.com/nXJXl0U.png 这是什么意思？
@Sagivb.g v1.0.0-beta.25
@DevangNaghera 抱歉，这只是粘贴错误。我已经编辑了问题
CardContent 组件是否真的存在于您导入的任何位置？

标签： reactjs material-ui

【解决方案1】：

感谢 Devang Naghera 指出这一点。

我注意到CardContent 是undefined，即使我将它导入到我的文件顶部

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

一种解决方法似乎是将我的导入更改为

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

代码现在可以工作了。

编辑：

事实证明，这个问题是由旧版本的 MUI 遗留的一些文件引起的。我删除了node-modules 并重新下载了依赖项，这为我解决了这个问题。

【讨论】：