为什么在 Next.js 的 `_app.js` 文件中无法使用 `getStaticProps`？

回答时间 : 2024-01-23

参考资料

Unable to use getStaticProps in _app.js

stackoverflow.com

`getStaticProps` / `getServerSideProps` can not be ...

nextjs.org

Compiler Error using TypeScript: "getServerSideProps" is ...

github.com

查看更多 10

答案

完善答案

在 Next.js 的 `_app.js` 文件中无法使用 `getStaticProps`，这是因为在 App 路由中，诸如 `getStaticProps`、`getServerSideProps` 和 `getInitialProps` 等数据获取方法不受支持[3]。这是为了确保应用的性能和可维护性。

要解决这个问题，可以考虑以下几个方案：

1. **在页面级别使用数据获取方法：** 在页面组件中使用 `getStaticProps` 或 `getServerSideProps`，而不是在 `_app.js` 文件中[2][7]。

2. **将全局数据放在公共组件中：** 如果数据是全局的，可以考虑将其放在一个公共组件中，然后在需要的页面中使用[8]。

3. **使用其他适当的生命周期方法：** 考虑使用其他适当的生命周期方法来获取数据，以满足在 App 路由中的要求[13]。

请注意，这些建议是为了适应 Next.js 中 App 路由的特殊性。更多信息可以参考 Next.js 文档[4][5][7]。