在 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>