生成页面时发生此错误。任何控制台日志都将显示在终端窗口浏览器中

Question

RangeError：超出最大调用堆栈大小 在此网络应用程序中，当在浏览器中编译此应用程序时，我在标头标记上看到了错误，并且在返回标记中有时看到了我做什么？

export default function Header() {
  return (
    <>
      <Header className=" header flex flex-sb">
        <div className="logo flex gap-2">
          Admin
          <div className="headerham felx flex-center"></div>
        </div>
      </Header>
    </>
  );
}

我尝试为下一个应用再创建一次，但我也面临这个错误

Answer 1

调用堆栈当然会被填满，因为您在没有基本情况的情况下递归调用功能组件。你不这样做。您甚至不应该在 ReactJS 中执行函数组件的递归调用。

export default function Header() {
  return (
    <>
      <Header ••• />
      {/* •••Rest of code••• */}
    </>
  )
}

如果只是名称冲突，请选择不同的名称。