解決父組件將子組件作為彈窗調(diào)用只執(zhí)行一次created的問題
1、問題原因
因?yàn)榈谝徽{(diào)用渲染子組件后，不再對子組件的created進(jìn)行調(diào)用
2、解決方法
用v-if將子組件包裹起來，因?yàn)関-if=false時(shí)可以將子組件銷毀掉，再次調(diào)用時(shí)重新渲染
3、上圖
初始默認(rèn)dialogVisible1=false，當(dāng)執(zhí)行打開窗口的操作時(shí)dialogVisible1為true，當(dāng)關(guān)閉窗口時(shí)dialogVisible1=false，從而每一次進(jìn)入彈窗都會(huì)重新渲染整個(gè)子組件。
補(bǔ)充知識(shí)：vue如何每次打開子組件彈窗都進(jìn)行初始化
:visible.sync 與 v-if同時(shí)使用即可。
以上這篇解決父組件將子組件作為彈窗調(diào)用只執(zhí)行一次created的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue3實(shí)現(xiàn)圖片縮放拖拽功能的示例代碼
v3-drag-zoom 是基于 vue3 開發(fā)的一個(gè)縮放拖拽組件,方便開發(fā)者快速實(shí)現(xiàn)縮放拖拽功能,效果類似地圖的縮放與拖拽,本文給大家介紹了vue3如何快速實(shí)現(xiàn)圖片縮放拖拽功能,感興趣的朋友可以參考下2024-04-04
vue.js 解決v-model讓select默認(rèn)選中不生效的問題
這篇文章主要介紹了vue.js 解決v-model讓select默認(rèn)選中不生效的問題，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-07-07
這篇文章主要介紹了Vue通過ref獲取dom元素屬性的方法,文中有詳細(xì)的方法介紹,對大家的學(xué)習(xí)或工作有一定的幫助,需要的朋友可以參考下2023-11-11
vue3封裝一個(gè)帶動(dòng)畫的關(guān)閉按鈕示例詳解
這篇文章主要為大家介紹了vue3封裝一個(gè)帶動(dòng)畫的關(guān)閉按鈕示例詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-09-09
這篇文章主要介紹了vue.config.js中的devServer使用方式,具有很好的參考價(jià)值,希望對大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03
一次vue項(xiàng)目優(yōu)化的實(shí)際操作記錄
用vue開發(fā)項(xiàng)目上線以后,發(fā)現(xiàn)首頁加載速度非常慢,如果項(xiàng)目比較大,甚至可能出現(xiàn)10s以上的等待,下面這篇文章主要給大家介紹了關(guān)于vue項(xiàng)目優(yōu)化的相關(guān)資料,需要的朋友可以參考下2022-09-09
vue項(xiàng)目打包后上傳至GitHub并實(shí)現(xiàn)github-pages的預(yù)覽
這篇文章主要介紹了vue項(xiàng)目打包后上傳至GitHub并實(shí)現(xiàn)github-pages的預(yù)覽，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
關(guān)于配置babel-plugin-import報(bào)錯(cuò)的坑及解決
這篇文章主要介紹了關(guān)于配置babel-plugin-import報(bào)錯(cuò)的坑及解決方案，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-12-12
基于 Vue 的 Electron 項(xiàng)目搭建過程圖文詳解
這篇文章主要介紹了基于 Vue 的 Electron 項(xiàng)目搭建過程，本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-07-07
vant之關(guān)于van-list的使用以及一些坑的解決方案
這篇文章主要介紹了vant之關(guān)于van-list的使用以及一些坑的解決方案，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2023-06-06