Javascript 尝试使用JSON数据填充卡时，获取元素类型是无效错误

我知道这个错误已经发布了很多次，但是没有一个修复对我有效。我已经坚持了一个星期了

我在业余时间学习react，我想制作一个网页，其中包含一个json对象，遍历它来填充卡片，然后返回卡片。这是在我导入到主页的组件中创建的。以下是错误：

未捕获错误：元素类型无效：内置组件应为字符串，复合组件应为类/函数，但得到：未定义。您可能忘记了从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。 检查仪表板的渲染方法

以下是主页：

import AppBar from "@material-ui/core/AppBar";
import { makeStyles } from "@material-ui/core/styles";
import Toolbar from "@material-ui/core/Toolbar";
import Typography from "@material-ui/core/Typography";
import "bootstrap/dist/css/bootstrap.min.css";
import React from "react";
import {CardComponent} from "../Components/CardsComponent";
import {DropdownMenu} from "../Components/DropdownComponent";
const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1
  },
  menuButton: {
    marginRight: theme.spacing(2)
  }
}));

export default function Dashboard() {
  const classes = useStyles();
  return (
    <div className={classes.root}>
      <div>
        <AppBar position="static" style={{ backgroundColor: "#182b36" }}>
          <Toolbar variant="dense">
            <DropdownMenu />
            <Typography variant="h6" color="inherit">
              Dashboard
            </Typography>
          </Toolbar>
        </AppBar>
      </div>
      <CardComponent/>
    </div>
  );
}

任何帮助或提示都将不胜感激

而不是从../Components/CardsComponent导入{CardComponent}； 使用从../Components/CardsComponent导入CardComponent

您在CardComponent.js中使用的是导出默认值和未命名导出

---

成功了！奇怪的是，我曾经像你说的那样拥有它，但是一个修复说要尝试使用{}，至少现在它可以工作了，谢谢！

import AppBar from "@material-ui/core/AppBar";
import { makeStyles } from "@material-ui/core/styles";
import Toolbar from "@material-ui/core/Toolbar";
import Typography from "@material-ui/core/Typography";
import "bootstrap/dist/css/bootstrap.min.css";
import React from "react";
import {CardComponent} from "../Components/CardsComponent";
import {DropdownMenu} from "../Components/DropdownComponent";
const useStyles = makeStyles(theme => ({
  root: {
    flexGrow: 1
  },
  menuButton: {
    marginRight: theme.spacing(2)
  }
}));

export default function Dashboard() {
  const classes = useStyles();
  return (
    <div className={classes.root}>
      <div>
        <AppBar position="static" style={{ backgroundColor: "#182b36" }}>
          <Toolbar variant="dense">
            <DropdownMenu />
            <Typography variant="h6" color="inherit">
              Dashboard
            </Typography>
          </Toolbar>
        </AppBar>
      </div>
      <CardComponent/>
    </div>
  );
}