因此,在我的数据库中,数据每分钟都会刷新(数据实际上更新,我检查过),然后我在页面上显示这些数据。当我在页面之间切换以及手动刷新页面时,数据会被获取,但如果我坐在一个页面上例如 5 分钟,即使数据库中的数据更新,数据也不会在页面端刷新。
是否可以刷新获取数据(假设用户在页面上处于活动状态时每分钟刷新一次),而无需始终点击刷新按钮?
我使用 useFetch() 获取数据,但我不使用任何其他参数,因为我不需要它们。在文档中特别指出,必须更改参数才能进行刷新工作。
var {data: fixture, refresh, pending, error} = await useFetch('/api/getFixture')``
我尝试过类似的事情:
function refreshing(){
refresh
console.log("refreshing")
}
setInterval(() => refreshing(), 10000);
该函数被执行,但数据没有刷新,因为如果我理解正确的话,参数没有变化,对吗?
我也尝试使用:
refreshNuxtData()
应该再次“执行”获取,但也没有运气。
感谢你并致以真诚的问候,
这是我的Github 仓库 https://github.com/kissu/so-setIntervalNuxt3和托管应用程序 https://venerable-kelpie-2828bc.netlify.app/在 Netlify 上。
我正在使用的代码
<script setup>
import { useIntervalFn } from '@vueuse/core' // VueUse helper, install it
const { pending, data, error, refresh } = await useFetch('https://jsonplaceholder.typicode.com/todos/1')
useIntervalFn(() => {
console.log(`refreshing the data again ${new Date().toISOString()}`)
refresh() // will call the 'todos' endpoint, just above
}, 3000) // call it back every 3s
</script>
<template>
<div v-if="!pending">
<pre>{{ data }}</pre>
</div>
</template>
这些是我在 Netlify 上使用的设置
正如您在控制台 + 网络选项卡中看到的那样,该应用程序运行正常
不确定什么对你不起作用,但这是在 Nuxt3 中使用 setInterval 的实际方法。
如果你想强制刷新,你可以用一行来完成(使用useFetch
's refresh
)
<button @click="refresh">force</button>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)