一般刷新页面可以用location.reload(true),history.go(0) 等方法,但是这对vue项目很不友好,会是页面重新加载,出现暂时性的空白,而且耗费性能,所以vue项目最好不用这些方法.vue有this.$forceUpdate()可以强制更新,下面介绍其他1种更好的方法.
通过v-if的功能触发页面刷新,结合provide和inject
<template>
<div id="app">
<router-view v-if="isShow"></router-view>
</div>
</template>
<script>
export default {
name: 'App',
provide () {
return {
reload: this.reload
}
},
data () {
return {
isShow: true
}
},
methods: {
reload () {
this.isShow= false
this.$nextTick(function () {
this.isShow= true
})
}
}
}
</script>
在要刷新的子路由页面引入inject,然后执行reload事件即可刷新页面
export default {
name: "demo",
inject:['reload'],
data() {
return {
}
},
methods: {
reflesh(){
this.reload()
},
}