在NextJs 13中将提供程序放在哪里？

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

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

我正在使用Mui的日期库，它需要一个提供程序来 Package 所有组件：

import { LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'

function App({ children }) {
  return (
    <LocalizationProvider dateAdapter={AdapterDayjs}>
      {children}
    </LocalizationProvider>
  );
}

字符串
但是NextJs 13中没有相应的App函数，它只提供/app目录中的页面。

next.js

来源：https://stackoverflow.com/questions/76653664/where-to-put-providers-in-nextjs-13

1条答案

按热度按时间

aemubtdh1#

在Next.js 13中，App函数被app目录中的根布局替换。您可以在app/layout.tsx文件中将提供程序 Package 在所有组件周围：

import { LocalizationProvider } from '@mui/x-date-pickers';
import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'

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

字符串
这会将LocalizationProvider应用于应用程序内的所有路由。children prop 将填充嵌套的布局或页面

赞(0）回复(0）举报 2023-08-04

我来回答

在NextJs 13中将提供程序放在哪里？

1条答案

相关问题

热门标签

最新问答