如何在 next.js 中實現帶有重定向的鏈接？

Question

我有以下反應組件，我試圖在 next.js 中實現。

反應組件：

import React from "react";
import { Route, Switch, Redirect, withRouter } from "react-router-dom";

import Dashboard from "../../pages/dashboard";
import Profile from "../../pages/profile";

function Layout(props) {
  return (
     <>
       <Switch>
          <Route
              exact
              path="/"
              render={() => <Redirect to="/app/dashboard" />}
           />
           <Route path="/app/dashboard" component={Dashboard} />
           <Route path="/app/profile" component={Profile} />
       </Switch>
     </>
 );
}

export default withRouter(Layout);

因為我對下一個很陌生。 j's，我不確定，如何在 next.js 中處理帶有重定向的路由，類似於上面的反應組件代碼。

任何幫助表示贊賞？

Answer 1

您正在將 React-Router 與 NextJS 一起使用，這是可能的，但不是最佳實踐。
NextJS 路由器是一個相當復雜的東西，因為它同時處理客戶端和服務器端路由。
您的/app/dashboard和/app/profile頁面應該正確呈現。 如果你想將/重定向到/app/dashboard ，你可以在pages/index.js文件的getInitialProps中使用這個技巧。