vue 组件销毁并重置的实现

• Z时代
• 2024-01-10
• 分类：综合

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

以上是 vue 组件销毁并重置的实现 的全部内容， 来源链接： utcz.com/z/336073.html