Next.js“使用客户端”在layout中的指令,tsx在移动的上中断

kxkpmulp 于 2023-08-04 发布在其他

关注(0)|答案(1)|浏览(109)

我正在尝试为我的next.js应用添加一个auth上下文。下面是我在layout.tsx文件中使用的代码：

"use client";

import './globals.css'
import type { Metadata } from 'next'
import { AuthProvider } from '@/context/AuthContext';

export const metadata: Metadata = {
  title: 'Test app',
}

export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <body>
        <AuthProvider>
          {children}
        </AuthProvider>
      </body>
    </html>
  )
}

字符串
当我用turbopack在开发服务器上运行这段代码时，它完全按照我在电脑上的预期工作，但在我正在测试的两个移动的设备上完全失败。它具体给出以下错误：
x1c 0d1x的数据

的
有趣的是，一旦我从layout.tsx文件中删除了"use client"指令，网站就可以正常工作了（尽管我还需要删除AuthContext）。我可以在任何其他页面上使用该指令。
有人能给予一下为什么会发生这种情况吗？非常感谢！