你好,我想找到一个方法,看看用户在我的网页应用程序是在线的还是离线的,并始终运行!如果用户离线,请等待10秒,查看是否恢复联机,如果不运行函数!
谢谢大家的帮助!
发布于 2022-01-21 09:51:09
创建一个像这样的组件OfflineComponent.vue:
<template>
<div>Offline component after 5 seconds!</div>
</template><script>
export default {
data() {
return {
showOnce: false,
}
},
mounted() {
this.startInterval()
},
methods: {
startInterval() {
window.setInterval(() => {
if (this.$nuxt.isOffline && !this.showOnce) {
this.runThisFunc()
this.showOnce = true
}
if (this.showOnce) {
clearInterval(window)
}
}, 5000)
},
runThisFunc() {
console.log('OFFLINE!')
},
},
}
</script>现在将它导入到您想要的页面中。我使用主页:
<template>
<div v-if="$nuxt.isOffline">
<offline-component></offline-component>
</div>
<div v-else>You are Online!</div>
</template><script>
import OfflineComponent from '~/components/offlineComponent.vue'
export default {
name: 'IndexPage',
components: {
OfflineComponent,
},
}
</script>https://stackoverflow.com/questions/70793344
复制相似问题