搜尋

首頁  >  問答  >  主體

在 NextJS 中使用 Next-Auth 時不間斷重新渲染

<p>這是我的「/app/api/auth/[...nextauth]/route.js」</p>
從「next-auth/next」匯入 NextAuth;
從「next-auth/providers/google」匯入 GoogleProvider;

導出常數 authOptions = {
  提供者:[
    谷歌提供者({
      clientId:process.env.GOOGLE_CLIENT_ID,
      clientSecret:process.env.GOOGLE_CLIENT_SECRET,
    }),
  ],
};

const 處理程序 = NextAuth(authOptions);
匯出 { 處理程序為 GET,處理程序為 POST };
; <p>和sessionProvider.js</p>
「使用客戶端」;

從“反應”導入反應;
從“next-auth/react”導入{SessionProvider};

const Sessionprovider = ({ 孩子 }) => {
  返回 {children};
};

導出預設Sessionprovider;</pre>
<p>我在 Layout.js 中使用這個將子元素包裝</p>

      <body className={inter.className}>
        {子層級}
      </正文>
    </html></pre>
<p>這是我的 page.js</p>
「使用客戶端」;
從“next-auth”導入{ getServerSession };
從「next-auth/react」匯入{signIn、signOut、useSession};
從“./api/auth/[...nextauth]/route”導入{ authOptions };

導出預設非同步函數 Home() {
  const { 資料:會話,狀態 } = useSession();
  控制台.log(會話);

  const _signInWithGoogle = async () =>; {
   等待登入(“Google”);
  };

  返回 (
    

首頁

{會議 ? ( <按鈕 onClick={() =>;登出()} className =“p-1 bg-blue-400 文字-白色字體-半粗體圓形-md懸停:bg-blue-500” > 登出 </按鈕> ) : ( <按鈕 onClick={_signInWithGoogle} className =“p-1 bg-blue-400 文字-白色字體-半粗體圓形-md懸停:bg-blue-500” > 登入 </按鈕> )}
); }</pre> <p>當我運行應用程式時,它會不斷地重新渲染。對此的任何幫助都不會勝感激。由於控制台顯示用戶對象,它仍然保留在登入元件中。</p>
P粉811329034P粉811329034448 天前576

全部回覆(1)我來回復

  • P粉828463673

    P粉8284636732023-09-06 00:06:41

    您需要從客戶端元件中刪除async

    "use client";
    
    export default function Home() {
    }
    

    https://github.com/vercel/next.js/issues/48822

    回覆
    0
  • 取消回覆