1.最差的方式：刷新页面,对用户体验不好

2.常见的方法：v-if控制组件的显示

3.利用forceUpdate强制更新，将触发updated钩子函数

<template> <div id="app"> <h1>{{Math.random()}}</h1> <button @click="update">Force Update</button></div> 
</template> <script> export default { methods:{ update(){ this.$forceUpdate(); } } };
</script>

4.利用mount进行重新挂载，将触发beforeMount与updated钩子函数

<div id="app"> <h1>{{Math.random()}}</h1> <button @click="update">Force Update</button> </div> 
</template> <script> export default { methods:{ update(){ this.$mount(); } } };
</script>

页面刷新的方法

用provide / inject 组合：在App.vue,声明reload方法，控制router-view的显示或隐藏，从而控制页面的再次加载。

<template> <div id="app"> <router-view v-if="isRouterAlive"></router-view> </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>

在需要用到刷新的页面。在页面注入App.vue组件提供（provide）的 reload 依赖，在逻辑完成之后（删除或添加…），直接this.reload()调用，即可刷新当前页面。
注入reload方法

export default { inject: ['reload'], 
}

在需要重载的地方直接调用

this.reload()