0

我正在尝试使用 next-auth 为我的应用程序设置身份验证，并且我需要在页面目录的“-App”页面中包含 {Providers}。代码应该如下所示，因为我将子组件包装在 Layout 组件中：

import Layout from '../components/Layout';
import '../styles/globals.css';

function MyApp({ Component, pageProps }) {
  return (
       <Layout>
          <Component {...pageProps} />
      </Layout>
  )
}

export default MyApp
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

但是，我不知何故需要包括提供者以使其看起来像这样：

import Layout from '../components/Layout';
import {Providers} from 'next-auth/client';
import '../styles/globals.css';

function MyApp({ Component, pageProps }) {
  return (
       <Providers>
          <Component {...pageProps} />
      </Providers>
  )
}

export default MyApp
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>

如何在不出错的情况下同时添加 Providers 和 Layout 组件？

4

0 回答 0