问题标签 [getstaticprops]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
4088 浏览

javascript - NextJS getStaticProps 没有将返回的道具传递给页面

我在让我的 getStaticProps 函数将返回的道具传递到 NextJS 中的模板页面时遇到了一些问题。

这是我目前用于动态页面模板的代码。

运行该站点时,该页面不会加载,并在主窗口中引发相同的控制台记录错误。

我有另一个网站以完全相同的方式设置,我绝对没有问题,所以我很难理解为什么从 getStaticProps 返回的道具没有被传递到构建页面的函数中。

任何帮助将不胜感激!

更新

这是编译站点时的错误日志。

更新#2

这是降价文件的内容。

0 投票
0 回答
64 浏览

reactjs - 如何在 nextjs 中跨组件共享 staticProps

我正在尝试使用 nextjs 建立一个网站。我认为这是我想做的事情的好选择,但现在我卡住了。

我有一个要调用并获取一些静态数据的 api 端点。但问题是我需要整个页面上的部分数据——而真正的问题似乎是——在我的组件上。

例如,我有 <Navbar/>&<Sidebar/>组件根据屏幕大小有条件地呈现。两者都需要一些数据,但都在我的<Layout/>组件中。

由于getStaticProps只能从页面导出,我不知道我应该如何在这些组件中获取数据。

据我所知,我可以在内部使用 getStaticProps,_app.js但缺点是我的页面无法再优化。但是,这是什么意思?这样做有什么缺点?

0 投票
1 回答
392 浏览

reactjs - getStaticProps 返回一个空对象

我正在使用带有 wp-graphql 和 apolloClient 的 nextJS V9.5.5 从 WordPress 获取数据。一切正常,但是当我尝试从 getStaticProps() 返回上下文(为了获取查询)时,就像文档中描述的那样,它返回一个空对象。

自定义应用程序:

其中一页:

这是日志结果: 控制台日志

我怎么能得到 context.query?

0 投票
1 回答
69 浏览

next.js - getStaticPath 和 URL 中需要的 filetype

/pages我有[page].jsindex.js

[page].js通过“CustomPage”的值生成所需的页面。它的内容来自一个 Data-JSON-File。

只要我从主页开始并使用网页内的链接,它就可以正常工作。例如,我现在有 2 页:/impressum 和 /datenschutz。

所以点击链接“Impressum”打开myDomain.com/impressum(它工作,但请注意,最后没有.html)。 但是,如果我刷新页面,或者myDomain.com/impressum直接在浏览器的地址栏中输入,我会收到一个未找到的错误(来自 nginx-server,而不是来自下一个!)。

第二次尝试

由于我需要一个完全静态的页面,并且出于测试目的在文件中添加了getStaticPathgetStaticProps,因此将创建“真实”的 html 文件:

这会将单个页面生成为真正的 html 文件: 在此处输入图像描述

但这将我引向下一个问题:我在网页中实现了内部链接,如下所示: 在此处输入图像描述

它仍然引导用户myDomain.com/impressum,现在另外还有myDomain.com/impressum.html可用的。从 SEO 的角度来看,这是两条不同的路径。

我如何将它们统一起来,以便我只有一个路径 - 无论是从我的网页中打开它,还是直接输入它。

解决方法的想法 (??)

当然,我可以在任何地方使用类似的东西:

但这仅在页面导出并复制到服务器时才有效。因为这行不通,因为 .html 文件不存在......所以我在页面上工作时会丢失“页面预览” next devnext start

所以我唯一的想法是为.env.development&设置一个 ENV-Variable.env.production并将 NEXT 中的 -Component 封装在 HOC 中。在那个 HOC 中,我可以检查我当前是否处于开发或生产中,并且不要将 .html 用于这些链接......否则将 .html 添加到链接中。

什么。您还有其他解决方案吗?

0 投票
1 回答
1109 浏览

json - 为什么我会收到“错误:序列化从 getStaticProps 返回的 ___ 时出错”?

我在里面打电话时收到以下错误,我getStaticProps不知道为什么:

我已将完整的应用程序代码放在CodeSandbox上。它无法访问 API,但它确实显示了事物的定义位置。

当我在 GraphQL 操场上运行以下查询时,我得到了预期的响应:

您可以看到该查询包含在沙箱上lingo.service.js的目录中,但主页有错误。我的功能不正确还是我把它叫错了?modules/lingo/servicesError serializingexport async function getAll()getStaticProps

0 投票
1 回答
457 浏览

reactjs - 我是否需要在 getStaticProps Next.JS 中为页面中的列表使用 revalidate 键?

我正在使用 Next.JS 制作静态电子商务应用程序。

我有产品目录index.js[id].js文件。我是否需要在返回所有产品列表的文件中使用revalidate: someTimeproducts/index.js保持列表最新?或者它的功能仅适用于产品单个页面 ( [id].js)?

提前感谢您的帮助!

0 投票
0 回答
406 浏览

caching - 如何在 NextJs 中为 getStaticProps 自动更新缓存?

我正在使用getStaticProps()revalidate: 3600 // 1 小时getStaticProps()中,我确实从 API 获取数据。构建后,我看到我的 API 数据是静态的,永远不会更新。

我可以在没有新版本的情况下以某种方式从 API 重新获取数据吗?

0 投票
1 回答
75 浏览

mongodb - 在动态路由的情况下,getstaticprops 不能使用 getstaticpaths 中的参数?MongoDB

我正在制作一个网页,该网页从 mongoDB(atlas BASIC 免费计划)中获取数据,并具有带有 SSG 的动态路由页面。动态路由页面,[cogid].js,有 getstaticpaths 和 getstaticprops。getstaticpaths 似乎有效,但 getstaticprops 无效。我猜问题是getstaticprops中的变量“params.cogid”......

0 投票
2 回答
3846 浏览

reactjs - 我可以在 getStaticProps 中使用 UseEffect 挂钩吗?

我有疑问..我可以在 getStaticProps 中使用 useEffect 吗?

我正在尝试在 getStaticProps 中运行一个函数……它可以工作……但我不知道这是否是推荐的做法。

如果不是...运行它的最佳方法是什么?

0 投票
0 回答
598 浏览

reactjs - NEXT.js ISR 移除静态页面

我对 ISR 有一点问题。我有 revalidate 道具等于 1 像这里

当我在 Contentful 中创建产品时,页面按预期创建。当我想进入不存在的页面时,我得到了预期的 404 错误。当我在现有产品的 Contentful 中更改某些内容或删除它时,问题就开始了。

当我在 Contentful 中删除产品时,产品页面中的产品列表会更新并且产品会消失,但我仍然可以进入该产品的页面。此外,当我重命名产品名称时,产品列表会更新,但我仍然可以进入较早的页面名称。

有什么办法可以解决这个问题吗?

获取静态路径

产品页面

编辑 当我在我的 product77 构建中重新验证静态页面后,我在 Contentful 中将产品名称从“product77”更改为“product7”仍然存在并且我仍然可以进入该页面。 在此处输入图像描述

重新验证后不应该删除吗?