vue 組件銷毀并重置的實現(xiàn)
更新時間：2020年01月13日 14:35:08 作者：O槑頭槑腦
這篇文章主要介紹了vue 組件銷毀并重置的實現(xiàn),文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
方法1
當數(shù)據(jù)變更后,通過watch 監(jiān)聽，先去銷毀當前的組件，然后再重現(xiàn)渲染。使用 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>
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
本篇文章主要介紹了提升頁面加載速度的插件InstantClick，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-09-09
本文為大家介紹下使用js判斷字符長度及中英文數(shù)字等，下面有個不錯的教程，感興趣的朋友可以參考下2013-12-12
JavaScript 中的replace方法說明...2007-04-04
這篇文章主要介紹了js實現(xiàn)橫向伸展開的二級導航菜單代碼,涉及javascript鼠標事件及頁面元素遍歷的相關(guān)技巧,需要的朋友可以參考下2015-08-08
這篇文章主要為大家詳細介紹了JavaScript實現(xiàn)顯示隱藏表單文字，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-09-09
Javascript實現(xiàn)可旋轉(zhuǎn)的圓圈實例代碼
這篇文章主要介紹了Javascript實現(xiàn)可旋轉(zhuǎn)的圓圈實例代碼,可實現(xiàn)圓圈的旋轉(zhuǎn)與運動效果,涉及javascript動態(tài)操作頁面元素屬性及進行相應數(shù)學運算的技巧,需要的朋友可以參考下2015-08-08
uni-app操作數(shù)據(jù)庫的三種方法總結(jié)
數(shù)據(jù)庫操作的,可以采用多方案,下面這篇文章主要給大家介紹了關(guān)于uni-app操作數(shù)據(jù)庫的三種方法,文中通過實例代碼和圖文介紹的非常詳細,需要的朋友可以參考下2023-05-05
這篇文章主要介紹了微信小程序日歷插件代碼實例,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下2019-12-12
這篇文章主要介紹了ES6中class關(guān)鍵字,class是es6引入的最重要特性之一。本文通過實例代碼給大家詳解，需要的朋友可以參考下2017-11-11
webix+springmvc session超時跳轉(zhuǎn)登錄頁面
這篇文章主要介紹了webix+springmvc session超時跳轉(zhuǎn)登錄頁面的相關(guān)資料,非常不錯具有參考借鑒價值，需要的朋友可以參考下2016-10-10