vue3 刷新当前页面(provide,inject)
在vue 3项目中。结合provide和inject,刷新当前页面。
·
vue3 实现刷新当前页面
用这种方法可以实现,但效果很差,白屏时间很长,自己试一下就知道了。
location.reload()
那么我们怎么做呢,别着急,马上看重点
:
首先去我们的App.vue里面(以下只显示此功能相关代码)
import { provide, ref, nextTick } from 'vue'
const isRouteActive = ref(true);
provide('reload', ()=>{
isRouteActive.value = false;
nextTick(()=>{
isRouteActive.value = true;
})
})
<template>
<route-view v-slot="{component}" v-if="isRouteActive">
<keep-alive>
<Component :is="component">
</keep-alive>
</route-view>
</template>
然后去我们需要刷新的页面
import { inject } from 'vue'
consr reload = infect('inject);
// 下面这行代码写在你需要reload的地方
reload();
这种效果很完美,试下就知道了~
另外:这两种,我试了都没有效果,不清楚为什么,有大佬知道的话,还望不吝赐教!
instance.proxy.$forceUpdate(); // 没用
router.go(0); // 没用
更多推荐
所有评论(0)