用location.reload()或this.$router.go(0),导致页面在刷新过程中会出现空白现象的发生,用户体验极其不佳。用下面这种方法可以解决这种问题:
先在App.vue中写入刷新方法reload();
<template>
<div id="app">
<router-view v-if="isRouterAlive" />
</div>
</template>
<script>
export default {
name: 'App',
provide (){
return {
reload:this.reload
}
},
data(){
return {
isRouterAlive:true
}
},
methods:{
reload (){
this.isRouterAlive = false
this.$nextTick(function(){
this.isRouterAlive = true
})
}
},
}
</script>
然后在你需要的页面里引用:
export default {
name: "homePage",
**inject:['reload'],**
components: {},
data() {
return {
timeType:'1',
},
methods:{
calcsStartTime(){
**this.reload();**
},
}
}