问题标签 [swr]

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 回答
448 浏览

reactjs - useSWR 与特定于经过身份验证的用户的数据

我想使用 SWR 为登录用户获取数据,但我不确定如何以正确的方式执行此操作。

例如,假设我想从api/get/cards登录的特定用户的 api 路径获取数据。我可以使用api/get/cards他们在 SWR 中键入,但我假设缓存不会知道数据仅特定于当前用户?然后缓存只会为最后一个使用它的用户提供数据,而不一定是当前调用它的用户?这样做的最佳方法是什么?

0 投票
1 回答
945 浏览

reactjs - SWR 维护的缓存在哪里,客户端还是服务器端?

我正在开发一个使用 SWR 的 Next JS 项目,我想知道 SWR 的缓存存储在哪里,是在客户端还是在服务器上?

我问是因为如果它在客户端上,因此每个用户的缓存都不同,那么我可以发出特定于用户的请求,而不必担心缓存会向用户显示其他用户的数据

0 投票
0 回答
240 浏览

javascript - 仅使用 Next.js 预渲染首页

我正在尝试将预渲染与getStaticProps()客户端渲染与常规userSwr()数据获取结合起来,但遇到了麻烦。

上下文:
我有一个可以跨越多个页面的结果列表,并且可以按各种属性(如卧室数量、租金等)进行过滤。分页和过滤的 url 可能看起来像/listings?page=2&bedrooms=3

我想使用 预渲染未过滤结果的第一页getStaticProps(),因此初始页面加载速度很快。从那里,我希望用户能够使用useSwr()hook从客户端进行数据调用,以获取其他页面或过滤结果。

问题:
结合这些数据获取模型的最佳方式是什么?我能找到的一切都建议预渲染结果的每一页,但我不想预渲染页面和过滤器的每一个排列。

目前的想法:
我目前的想法是

  • 获取第一页数据getStaticProps并将其作为道具传递
  • 使用挂钩从客户端获取其他页面和过滤结果
  • 使用类似这个答案的东西来防止钩子在初始渲染上运行。

有没有更好的方法来只预渲染第一页,然后再进行客户端渲染?

0 投票
1 回答
485 浏览

typescript - useInfiniteSWR 与 axios 和 typescript

我们有一个很好的例子,说明如何在官方仓库https://github.com/vercel/swr/blob/master/examples/axios-typescript/libs/useRequest.ts上使用 axios 和 typescript 的 useSWR 钩子

如何实现将 useSWRInfinite 与 axios 和 typescript 一起使用的示例?

0 投票
1 回答
428 浏览

javascript - 如何在反应中使用 swr 返回数据?

我尝试显示数据,并使用 swr 数据获取和反应,这里是代码:

问题是它卡在加载中并且数据不会得到更新并且是未定义的,提取器中的数据控制台日志似乎也可以正常工作。

如何在反应中使用 swr 获取数据并显示获取的数据?

0 投票
1 回答
148 浏览

reactjs - 如何在模拟钩子上触发 setState

我有一个使用从服务器获取数据的钩子的组件,并且我已经模拟了该钩子以返回我的测试数据。现在如果mutate调用函数(由钩子返回),正常的实现会再次获取数据并导致重新渲染(我正在使用swr这里是mutate参考)。

如何在模拟setState钩子上触发重新渲染/?

我要测试的内容:简单地说,如果用户创建了一个项目,则应该重新获取并显示项目列表。

说明问题的代码:

0 投票
0 回答
58 浏览

react-state-management - 是否可以使用 useSWR 知道重新验证的原因?

我正在使用节点包https://github.com/vercel/swr,并且正在触发挂钩以重新验证数据。我注意到它没有返回值(如状态)来告诉我重新验证的原因(超时、焦点、引起的变异等)。反正有知道的吗?

我当前的通话如下所示:

0 投票
1 回答
1928 浏览

reactjs - Next.js 使用 SWR 和 axios

我正在尝试使用 SWR 在我的项目中预取数据。这是我的代码:

它在第一次渲染中效果很好。同时,我没有更改数据库中的任何数据,所以当它第二次渲染时refreshInterval:1000它不会改变任何东西,但它会弹出一些错误!

errorHere SyntaxError: Unexpected token < in JSON at position 0

当我第一次看到错误时,我猜这只是一些 JSON 问题,所以我更改了 fetcher 的返回值(r)=>r.data

在我更改此设置后,它导致网络返回loading... 这意味着它在第二次渲染中甚至在第一次渲染之后都没有获取任何内容。

有没有人可以帮助我找出导致错误的问题。谢谢~

0 投票
2 回答
2454 浏览

node.js - 如何将两个参数传递给 Javascript/NodeJS 中的 API“获取”请求

我有一个 React 组件,它必须对 MongoDB 数据库执行带有两个参数的 find({}) 查询。

由于 Mongo 代码仅适用于服务器,因此我必须进行 API 调用(我正在使用 NextJS)。这个 API 调用显然是一个 GET 请求。如何使用 SWR(或 fetch)将“postId”和“userId”传递给获取请求?

我试图通过“身体”将它们作为对象传递,但我认为这根本不是正确的方法。

我无权访问 URL 查询字符串

我有一种感觉,我可能在这里不太重要。任何帮助将不胜感激。干杯,马特

0 投票
0 回答
126 浏览

reactjs - 如何从 onsubmit 函数内部调用 swr-firestore 的 useCollection

在这里我需要调用 useCollection('adminUsers') ...etc 因为我的firebase规则发生了变化,认证后只允许用户获取任何收集数据。目前我在身份验证之前收集了管理员的相关信息。所以我没有得到管理员的相关收集数据。任何关于如何在 signInWithEmail 方法上获取收集数据的建议。谢谢你。