将单个 getServerSideProps 方法导入 Nextjs 中的多个页面答案

【问题标题】：import a single getServerSideProps method to multiple pages in Nextjs将单个 getServerSideProps 方法导入 Nextjs 中的多个页面
【发布时间】：2022-01-10 23:28:43
【问题描述】：

我正在尝试将 getServerSideProps 方法从该页面导入到另一个页面，并在多个页面中使用它。我该怎么做？

这是我的代码：

import DashboardLayout from "@app/layout/DashboardLayout";
import Overview from "@containers/dashboard/Overview";
import { parsedCookie } from "@infrastructure/utils/functions";

const OverviewPage = () => {
  return (
    <DashboardLayout>
      <Overview />
    </DashboardLayout>
  );
};

export default OverviewPage;

export const getServerSideProps = async (context) => {
  const token = parsedCookie(context.req);
  const { accessToken, refreshToken } = token;
  if (!accessToken || !refreshToken) {
    return {
      redirect: {
        destination: "/",
        permanent: false,
      },
    };
  }

  return {
    props: {},
  };
};

【问题讨论】：

将此函数放在一个单独的文件中，并在需要的地方导入。

标签： javascript reactjs ecmascript-6 next.js es6-modules

【解决方案1】：

您不能导入getServerSideProps，它们对于每个页面都是唯一的，但如果第一次加载的所有页面都应该获得相同的数据，您可以在您的_app.js 文件中添加getIntialProps。有关更多信息，您可以阅读 customizing _app.js files

【讨论】：

【解决方案2】：

我找到了答案。下面是如何在另一个页面上使用页面数据获取方法

import DashboardLayout from "@app/layout/DashboardLayout";
import MyCourses from "@containers/dashboard/MyCourses";
import { getServerSideProps } from "../index";

const MyCoursesPage = () => {
  return (
    <DashboardLayout>
      <MyCourses />
    </DashboardLayout>
  );
};

export default MyCoursesPage;

export { getServerSideProps };

【讨论】：

这是不正确的。此道具不适用于任何组件。这是专为页面设计的
@abhikumar22 你说得对，getServerSideProps 不能在页面组件之外使用，但是 OP 没有提到“任何组件”，他具体说 “使用页面数据在另一个页面"上获取方法（重点是我的）。