问题标签 [swr]

我有一个 React 功能组件，它以与 Instagram 故事非常相似的方式呈现课程视频播放器。课程中的一些视频（“剪辑”）具有“交互”，会弹出一张卡片，用户可以在其中回答多项选择题。代码简化如下。

在随机课程中，一些交互没有显示出来。在日志交互 1中，它们照常显示（记录了一堆未定义的值，然后在几次重新渲染后记录了数组），但是当调用onClipEnding函数时，交互 2再次未定义。

关于可能发生的事情的任何线索？我最好的猜测是一个陈旧的关闭，但我找不到解决它的方法。

我对 axios 和拦截器进行了身份验证，但我遇到了用户注销问题。

当 accessToken 失效时，我用 refreshToken 调用 revalidate。什么时候甚至 refreshToken 无效我想注销用户，但我不确定如何停止/清除应用程序中由 useSWR 和 axios fetcher 触发的所有请求。

这样做的最佳做法是什么？

目前，我正在对所有触发的请求调用拒绝onExpired- 但这仍然会缓存所有请求，因此在用户重新登录后仍然有以前的数据。如果我不拒绝该请求，它就会卡在加载中。

我也试过cache.clear()打电话import {cache} from 'swr'

当页面更改时，会创建新查询并将其数据设置为 initialData。在这种情况下，用户会在获取新查询数据之前看到 initialData：

我的问题是每次查询新数据时都会使用 initialData 作为后备：

您对如何防止这种闪烁有任何想法吗？

我有以下由瑞士政府永久提供的 JSON API。

https://www.bfs.admin.ch/bfsstatic/dam/assets/14856203/master

我试图列出一些没有出现在第一级的内容——在我的例子jaStimmenInProzent中，每张投票的一些投票统计信息（）（vorlagenId）：

我正在使用fetch API和Vercel SWR。不幸的是，我找不到映射的内容没有出现在第一级的教程/示例。任何想法如何继续并vorlagen列出阵列？我尝试了以下但没有成功（请参阅沙箱）：

这是我第一次使用 SWR hook，实际上一切都很好。但是我有一个错误，我真的不知道那里发生了什么，所以让我先给你看我的代码。

这是全局配置

这就是我使用它的地方

现在，这是错误

目标：我只是想摆脱这个问题。你知道什么可能导致这个问题吗？

我正在开发一个 ReactJS Web 应用程序，但遇到了一个问题。问题是我有一些 JSON 数据的 URL 数组，我想使用“useSWR”钩子从服务器获取所有这些 JSON 数据（以便获取的数据也被缓存）。现在的问题是根据规则，我们不能在任何循环或块内使用钩子。

例子 -

1. 我所拥有的 - [“http://someapi/a.json”、“http://someapi/b.json”、“http://someapi/c.json”]
2. 我想要做的 - 遍历这个数组并使用 useSWR 钩子调用这些 url，这样我就有了 [ JSON ObjectA, JSON ObjectB, JSON ObjectC ] 的列表
3. 为什么我要尝试使用“useSWR”，因为我知道，这些数据在 24 小时内都不会改变，我想缓存这些值。

谁能建议我如何遍历 URL 列表并使用 useSWR 挂钩调用服务器？还有其他一些优化的方法来解决这个问题吗？非常感谢任何帮助或指导。

我在这里发布了一些关于 SWR hook 的问题，因为在我尝试使用它的过程中有点困难，因为我遇到了一些问题

现在这一次错误似乎很小。

我想做的是在我的 API 中设置一个断点，试图获取一些数据，（顺便说一下，我正在使用 axios）现在的问题是，我必须{data}从 useSWR 解构，因为那是我的数据'我从 axios 接收，我认为这导致了一个参数问题，我必须将其传递给钩子以使一切正常。

让我给你看一些代码

使用 useSWR

如您所见，我传递给函数的最后一个参数是名称数据，因为如果我不这样做，它会给我错误（如前所述，我已经发布了一个关于该问题的问题），这是

目标：那里发生了什么，我该如何解决这个问题？具体是什么原因造成的，为什么？

谢谢你的时间 ！！

更新

我已经更改了我的代码，这是出现的错误

错误

我第一次将 SWR 钩子与 next.js 一起使用，我试图得到一些关于某些东西的答案，但我无法得到它们，甚至没有文档。

问题：所以，我知道 SWR 为您的数据提供缓存，并且它会实时更新，但我有点迷失在您必须使用挂钩的两个选项之间。所以，通常，你有 dedupeInterval 和 refreshInterval

现在，这两者有什么区别？如果我有两个使用相同密钥的请求，它会在两秒钟后更新吗？它与 refreshInterval 相同吗？如果我使用 refreshInterval，我会遇到性能问题吗？因为它在很短的时间内发出请求

如果你能帮我解决这个问题，那就太好了！

谢谢你的时间 ！！

在过去的一个小时里，我一直在用头撞我的桌子，试图弄清楚为什么下面的代码只显示加载微调器，并且即使我可以看到控制台中记录的数据，也永远不会更新以显示实际数据，所以我知道实际上正在获取数据。

应该发生的是，页面将在第一次检索数据时显示微调器加载器，然后在useSWR完成获取数据后，页面将重新渲染以显示数据。数据最终会像地球一样显示出来，但作为原型，我只是用.map. 该页面也不应该再次显示微调器。

我认为我的问题可能与调用函数在最后更新钩子导致整个页面重新渲染有关，尽管我不确定，如果是这种情况，我不知道如何考虑到 SWR 如何自发地重新获取数据，我会做这项工作。

这是主文件：

这是地球组件：

这是使用百分比：

我正在做一个 facebook 克隆，每次我按赞按钮时，我都想立即看到更改，这是 swr 提供的，但是，它只会在 4-8 秒后更新：/

我试图做的是：当我点击喜欢的按钮时，我首先改变 swr 提供的缓存，然后我调用 API，然后重新验证数据以查看数据是否正确，实际上我控制台日志缓存并立即更新，但 UI 没有，我不知道为什么

让我给我的代码一些上下文

这就是我的出版物的样子（在 pub 里面是 likes 属性）

这是我要求所有带有 getStaticProps 的出版物的地方

这就是like按钮所在的地方（关注LikePub，那里有逻辑）

条件很简单，如果用户已经喜欢了一个酒吧，就砍掉喜欢，否则，喜欢这个酒吧

正如你所看到的，我 console.log 发布的喜欢，这就是发生的事情

标识符被添加到缓存中，表示用户喜欢该 pub，但 UI 没有更新，更新需要 4 - 7 秒，可能更长时间，删除like 时发生同样的事情，看看这个

剪切之类的，但是，用户界面不更新

我很绝望，我已经尝试了一切，我已经尝试解决这个问题将近一个星期，但什么也没找到，我做错了什么，这是一个错误吗？