NextJs go 到新頁面而不刷新頁面和更改狀態

Question

我有一個NextJS應用程序，我正在嘗試添加動態路由以將它們用作我服務器上的端點。

我有一個register.tsx文件，當我將 go 加載到localhost:3000/register

在其中一個組件中，我想更新到/register/user/的鏈接，但是，當我使用時：

useEffect(() => {
        router.push('/user', undefined, { shallow: true })
    }, [])

在我的組件內部進入一個全新的頁面並丟失所有狀態。 我怎樣才能做到這一點。 我的server.ts文件中有這個：

app.post("/register/user", async (req, res) => {
    
})

編輯

我能夠通過將應用程序的文件結構更改為

pages
--register
----[[..slug]].tsx

然而，現在：

app.post("/register/user", async (req, res) => {

})

返回 html object 我已將其設置為返回 JSON ZA8CFDE6331BD59EB26AC96F89111C4

Answer 1

您需要將state向上移動，高於組件層次結構中的所有頁面，因此當頁面更改時，state 保持不變。 在您的_app.js文件中，您可以有一個包裝page component的provider ，這樣每個頁面都可以訪問數據。 例如像這樣：

        <AuthProvider
          options={{
            clientMaxAge: 0 //60 * 60
          }}
          session={pageProps.session}
        >
            <Component {...pageProps} />
        </AuthProvider>

現在所有頁面都可以訪問AuthProvider提供的數據