/

Next.js，在導航時組件狀態未刷新時應該怎麼辦

Next.js，在導航時組件狀態未刷新時應該怎麼辦

我遇到了這個問題，基本上我的組件使用了 useState() hook 來設置一些變量，但在使用路由進行導航時，狀態並沒有被更新。

事實證明，我的自定義 _app.js 代碼，這段代碼是我從教程中複製過來的，只是用於為應用添加全局樣式，其中存在著這段代碼：

1
2
3
export default function App({ Component, pageProps }) {
 return <Component {...pageProps} />
}

我將其更改為：

1
2
3
4
5
6
7
import { useRouter } from 'next/router'

export default function App({ Component, pageProps }) {
 const router = useRouter()

 return <Component {...pageProps} key={router.asPath} />
}

這樣做後，它又按預期工作了。

我只需將路徑作為 key 添加即可。

tags: [“Next.js”, “useState()”, “router”]