如何解决在 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 Router 中，一些先前的数据获取方法，如 `getServerSideProps`、`getStaticProps` 和 `getInitialProps` 都不再受支持[3][13]。解决此问题的方法是在全局数据获取方面采取替代措施。

以下是可能的解决方案：

1. **使用其他生命周期方法：** 在 `_app.js` 中，可以使用其他生命周期方法，如 `getInitialProps`（如果使用旧版本）或其他适用的方法来获取全局数据[1]。

2. **在页面组件中获取数据：** 如果全局数据可以在具体的页面组件中获取，考虑将数据获取逻辑移动到页面组件中[2]。

3. **使用全局状态管理：** 考虑使用全局状态管理库，如 Redux 或 React Context，来管理和共享全局数据[8]。

请注意，在新的 Next.js 版本中，可能需要更改应用的架构以适应新的数据获取方式[9]。