vue项目中数据改变之后刷新页面

页面实时更新的方法：

1.window.onload.reload()

2.this.$route.go(0)

3.推荐使用该方法刷新页面

①  <router-view v-if="isRouterAlive"/>

② APP组件中操作：

　　data 中定义变量

　　data () {

return {

isRouterAlive: true

}

}

　③ methods中定义方法

　　reload() {

this.isRouterAlive = false

this.$nextTick(function () {  //在下次dom更新循环结束之后执行延迟回调。数据更新之后立即使用这个方法，获得更新后的dom

this.isRouterAlive = true

})

},

④ 将该方法provide出去

　　provide () {

return {reload: this.reload}

},

⑤前面四步就将该方法在app中设置完成，接下来组件中引用该方法

　　export default {

　　inject: [‘reload‘], // 引入页面同步刷新的依赖

　　  methods:{

getMag(){

　　　　　　this.reload() //直接使用该方法

　　　　　　}

　　　　}

　　 },

总结：前两种方法会出现白屏现象，推荐使用第三种方法

原文地址：https://www.cnblogs.com/cjechenjinge-0820/p/12051416.html