问题标签 [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.
javascript - NextJS getStaticProps 没有将返回的道具传递给页面
我在让我的 getStaticProps 函数将返回的道具传递到 NextJS 中的模板页面时遇到了一些问题。
这是我目前用于动态页面模板的代码。
运行该站点时,该页面不会加载,并在主窗口中引发相同的控制台记录错误。
我有另一个网站以完全相同的方式设置,我绝对没有问题,所以我很难理解为什么从 getStaticProps 返回的道具没有被传递到构建页面的函数中。
任何帮助将不胜感激!
更新
这是编译站点时的错误日志。
更新#2
这是降价文件的内容。
reactjs - 如何在 nextjs 中跨组件共享 staticProps
我正在尝试使用 nextjs 建立一个网站。我认为这是我想做的事情的好选择,但现在我卡住了。
我有一个要调用并获取一些静态数据的 api 端点。但问题是我需要整个页面上的部分数据——而真正的问题似乎是——在我的组件上。
例如,我有 <Navbar/>
&<Sidebar/>
组件根据屏幕大小有条件地呈现。两者都需要一些数据,但都在我的<Layout/>
组件中。
由于getStaticProps
只能从页面导出,我不知道我应该如何在这些组件中获取数据。
据我所知,我可以在内部使用 getStaticProps,_app.js
但缺点是我的页面无法再优化。但是,这是什么意思?这样做有什么缺点?
next.js - getStaticPath 和 URL 中需要的 filetype
在/pages
我有[page].js
和index.js
。
[page].js
通过“CustomPage”的值生成所需的页面。它的内容来自一个 Data-JSON-File。
只要我从主页开始并使用网页内的链接,它就可以正常工作。例如,我现在有 2 页:/impressum 和 /datenschutz。
所以点击链接“Impressum”打开myDomain.com/impressum
(它工作,但请注意,最后没有.html)。
但是,如果我刷新页面,或者myDomain.com/impressum
直接在浏览器的地址栏中输入,我会收到一个未找到的错误(来自 nginx-server,而不是来自下一个!)。
第二次尝试
由于我需要一个完全静态的页面,并且出于测试目的在文件中添加了getStaticPath
和getStaticProps
,因此将创建“真实”的 html 文件:
但这将我引向下一个问题:我在网页中实现了内部链接,如下所示:
它仍然引导用户myDomain.com/impressum
,现在另外还有myDomain.com/impressum.html
可用的。从 SEO 的角度来看,这是两条不同的路径。
我如何将它们统一起来,以便我只有一个路径 - 无论是从我的网页中打开它,还是直接输入它。
解决方法的想法 (??)
当然,我可以在任何地方使用类似的东西:
但这仅在页面导出并复制到服务器时才有效。因为这行不通,因为 .html 文件不存在......所以我在页面上工作时会丢失“页面预览” next dev
。next start
所以我唯一的想法是为.env.development
&设置一个 ENV-Variable.env.production
并将 NEXT 中的 -Component 封装在 HOC 中。在那个 HOC 中,我可以检查我当前是否处于开发或生产中,并且不要将 .html 用于这些链接......否则将 .html 添加到链接中。
你说什么。您还有其他解决方案吗?
json - 为什么我会收到“错误:序列化从 getStaticProps 返回的 ___ 时出错”?
我在里面打电话时收到以下错误,我getStaticProps
不知道为什么:
我已将完整的应用程序代码放在CodeSandbox上。它无法访问 API,但它确实显示了事物的定义位置。
当我在 GraphQL 操场上运行以下查询时,我得到了预期的响应:
您可以看到该查询包含在沙箱上lingo.service.js
的目录中,但主页有错误。我的功能不正确还是我把它叫错了?modules/lingo/services
Error serializing
export async function getAll()
getStaticProps
reactjs - 我是否需要在 getStaticProps Next.JS 中为页面中的列表使用 revalidate 键?
我正在使用 Next.JS 制作静态电子商务应用程序。
我有产品目录index.js
和[id].js
文件。我是否需要在返回所有产品列表的文件中使用revalidate: someTime
以products/index.js
保持列表最新?或者它的功能仅适用于产品单个页面 ( [id].js
)?
提前感谢您的帮助!
caching - 如何在 NextJs 中为 getStaticProps 自动更新缓存?
我正在使用getStaticProps()和revalidate: 3600 // 1 小时 在getStaticProps()中,我确实从 API 获取数据。构建后,我看到我的 API 数据是静态的,永远不会更新。
我可以在没有新版本的情况下以某种方式从 API 重新获取数据吗?
mongodb - 在动态路由的情况下,getstaticprops 不能使用 getstaticpaths 中的参数?MongoDB
我正在制作一个网页,该网页从 mongoDB(atlas BASIC 免费计划)中获取数据,并具有带有 SSG 的动态路由页面。动态路由页面,[cogid].js,有 getstaticpaths 和 getstaticprops。getstaticpaths 似乎有效,但 getstaticprops 无效。我猜问题是getstaticprops中的变量“params.cogid”......
reactjs - 我可以在 getStaticProps 中使用 UseEffect 挂钩吗?
我有疑问..我可以在 getStaticProps 中使用 useEffect 吗?
我正在尝试在 getStaticProps 中运行一个函数……它可以工作……但我不知道这是否是推荐的做法。
如果不是...运行它的最佳方法是什么?
reactjs - NEXT.js ISR 移除静态页面
我对 ISR 有一点问题。我有 revalidate 道具等于 1 像这里
当我在 Contentful 中创建产品时,页面按预期创建。当我想进入不存在的页面时,我得到了预期的 404 错误。当我在现有产品的 Contentful 中更改某些内容或删除它时,问题就开始了。
当我在 Contentful 中删除产品时,产品页面中的产品列表会更新并且产品会消失,但我仍然可以进入该产品的页面。此外,当我重命名产品名称时,产品列表会更新,但我仍然可以进入较早的页面名称。
有什么办法可以解决这个问题吗?
获取静态路径
产品页面
编辑 当我在我的 product77 构建中重新验证静态页面后,我在 Contentful 中将产品名称从“product77”更改为“product7”仍然存在并且我仍然可以进入该页面。
重新验证后不应该删除吗?