vue组件无空白局部刷新

1. 在展示 要刷新的组件的 父组件中引入以下函数

   <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>
   

2. 在父组件中 展示 子组件的标签中使用

    //组件引用
    <div id="wendu">
            <ECharts v-if="isRouterAlive"></ECharts>
     </div>
     
    //如果是路由
    <router-view v-if="isRouterAlive/>
   

3. 在要使用局部刷新的组件中 引入

   export default {
   	inject:['reload'], //接收
   	data()
   	{
   	return{
   	 ......
   	 }
   	}
   }
   
   

4. 调用：

   this.reload();