时间戳

首页 > 解决方案 > 如何在 next.js 中实现带有重定向的链接？

javascript - 如何在 next.js 中实现带有重定向的链接？

问题描述

我有以下我试图在 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 中处理带有重定向的路由，类似于上面的反应组件代码。

任何帮助表示赞赏？

标签： javascriptreactjsnext.js

解决方案

您正在使用带有 NextJS 的 React-Router，这是可能的，但不是最佳实践。
NextJS 路由器是一个相当复杂的东西，因为它同时处理客户端和服务器端路由。
您的/app/dashboard和/app/profile页面应该正确呈现。如果你想重定向/到/app/dashboard你可以在文件中使用这个技巧。getInitialPropspages/index.js

推荐阅读