vue 组件销毁并重置

作者: O槑頭槑腦 | 来源:发表于2019-03-29 11:04 被阅读0次

方法1

当数据变更后,通过watch 监听，先去销毁当前的组件，然后再重现渲染。使用 v-if 可以解决这个问题

<template>
   <third-comp v-if="reFresh"/>
</template>
 
<script>
   export default{
       data(){
          return {
                reFresh:true,
                menuTree:[]
            }
       },
       watch:{
             menuTree(){
 
                  this.reFresh= false
                  this.$nextTick(()=>{
                    
                    this.reFresh = true
                })
            }
       }
}
</script>

方法2


<template>
  <third-comp :key="menuKey"/>
</template>

<script>
  export default{
      data(){
         return {
               menuKey:1
           }
      },
      watch:{
            menuTree(){

               ++this.menuKey
           }
      }
}
</script>