解決父組件將子組件作為彈窗調(diào)用只執(zhí)行一次created的問題
更新時間：2020年07月24日 09:14:25 作者：Coca~cola
這篇文章主要介紹了解決父組件將子組件作為彈窗調(diào)用只執(zhí)行一次created的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
1、問題原因
因?yàn)榈谝徽{(diào)用渲染子組件后，不再對子組件的created進(jìn)行調(diào)用
2、解決方法
用v-if將子組件包裹起來，因?yàn)関-if=false時可以將子組件銷毀掉，再次調(diào)用時重新渲染
3、上圖
初始默認(rèn)dialogVisible1=false，當(dāng)執(zhí)行打開窗口的操作時dialogVisible1為true，當(dāng)關(guān)閉窗口時dialogVisible1=false，從而每一次進(jìn)入彈窗都會重新渲染整個子組件。
補(bǔ)充知識：vue如何每次打開子組件彈窗都進(jìn)行初始化
:visible.sync 與 v-if同時使用即可。
以上這篇解決父組件將子組件作為彈窗調(diào)用只執(zhí)行一次created的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
之前文章我們描述給過Vue3 的七通信使用，今天中五篇文章我們再來看看Vue2 的通信使用寫法的相關(guān)資料,需要的朋友可以參考下面文章的具體內(nèi)容2021-09-09
Vue開發(fā)中出現(xiàn)Loading?Chunk?Failed的問題解決
本文主要介紹了Vue開發(fā)中出現(xiàn)Loading?Chunk?Failed的問題解決，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-03-03
Vue滑塊驗(yàn)證碼組件anji-captcha的使用案例詳解
滑塊驗(yàn)證是一種常見的人機(jī)識別方法，這篇文章主要介紹了Vue滑塊驗(yàn)證碼組件anji-captcha的使用,本文通過實(shí)例代碼圖文相結(jié)合給大家介紹的非常詳細(xì)，需要的朋友可以參考下2023-05-05
這篇文章主要介紹了vuecli4中如何配置打包使用相對路徑，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-07-07
在現(xiàn)代前端開發(fā)中,拖拽功能是增強(qiáng)用戶體驗(yàn)的重要手段之一,本文將詳細(xì)介紹如何在Vue3中封裝一個拖拽指令并通過實(shí)戰(zhàn)例子演示其實(shí)現(xiàn)過程,希望對大家有所幫助2024-11-11
vue的.vue文件是怎么run起來的(vue-loader)
通過vue-loader，解析.vue文件，在webpack解析，拆解vue組件 ，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友參考下2018-12-12
Vue3獲取DOM節(jié)點(diǎn)的3種方式實(shí)例
Vue本來無需操作DOM來更新界面,而且Vue也不推薦我們直接操作DOM,但是我們非要拿到DOM操作DOM怎么辦,下面這篇文章主要給大家介紹了關(guān)于Vue3獲取DOM節(jié)點(diǎn)的3種方式,需要的朋友可以參考下2023-02-02
解決vue2 在mounted函數(shù)無法獲取prop中的變量問題
這篇文章主要介紹了vue2 在mounted函數(shù)無法獲取prop中的變量的解決方法 ,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2018-11-11
vue使用WEB自帶TTS實(shí)現(xiàn)語音文字互轉(zhuǎn)的操作方法
這篇文章主要介紹了vue使用WEB自帶TTS實(shí)現(xiàn)語音文字互轉(zhuǎn),本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友參考下吧2024-01-01
這篇文章主要介紹了vue 表單之v-model綁定單選按鈕radio的實(shí)例代碼，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下2019-05-05