vue中 刷新页面 ，只刷新main部分， 导航栏不刷新

Question

点击刷新按钮 只是 改变main部分 ， 导航栏 和侧边栏不改变 怎么实现呢 ？？

app.VUE 中<template>
<div id="app">

<router-view v-if="isRouterAlive"></router-view>
<!-- <router-view></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>
在 组件里面 export default {
inject: ['reload'],

data() {

return {

},
 给刷新按钮一个点击事件   
handleRefres() {
  this.reload()
  这样还是整体刷新 导航栏也会跟着刷新 
 
},

Answer 1

你这刷新只是重新拉取下数据吧

Answer 2

你调用reload肯定会整个网页都会刷新的，只想刷新main部分的话，就重置下数据吧。

Answer 3

看的出来你拉取数据的方法应该在list组件创建的钩子中有调用，现在想做的只是把list组件主动销毁，再创建，但你dom全部都加载出来了，还用$nextTick没有任何意义。
建议改成定时器再试试

this.isRouterAlive = false
setTimeout(() => {
    this.isRouterAlive = true
}, 200)