鍍金池/ 問答/HTML/ 關(guān)于vue組件的生命周期問題，我遇到這個問題怎么這么奇怪？？？

關(guān)于vue組件的生命周期問題，我遇到這個問題怎么這么奇怪？？？

在home.vue組件中
我有兩個組件：detail.vue和edit.vue

在兩個子組件的mounted函數(shù)中試圖打印出各自的dom。但是結(jié)果卻發(fā)生如下情況：
圖片描述

edit組件undefined，而detail組件可以正常打印，home組件也正確打印，這是為什么，

eidt和detail組件初始都是v-if='false',也就是說初始都是不顯示的。這是為什么？

//home.vue中
<detail ref='detail' v-on:openedit='openEdit'></detail>
<edit ref='edit'></edit>
回答
編輯回答
旖襯

v-show

2017年11月12日 14:03
編輯回答
絯孑氣

vue只能通過el來判斷有沒掛接，記得哪個文檔說過mounted只說明開始掛接DOM了，但并不一定已經(jīng)完成掛接

2017年2月24日 17:31
編輯回答
墨小羽

大概說一下~

vue 中 v-if 是不渲染到dom 也就所謂的html頁面代碼
當頁面加載 數(shù)據(jù)掛載 也就是虛擬dom 與 dom 比對 形成渲染 所以 他沒有得到 v-if的數(shù)據(jù)

當然你通過dom肯定無法獲取到
至于打印出來如圖確實是一個deail class 的 div 具體組件內(nèi)部 并不了解 不詳細說了~

2018年4月30日 21:46
編輯回答
愚念

自問自答吧，這個問題自己找了一上午算是找出個所以然了。
不知道在哪篇文檔看到，vue每次只存在一個vue實例（不知道我說的準不準確），所以在home組件中，只有home這個實例，然后兩個子組件可能是虛擬加載（按需加載），兩個子組件都是v-if='false',所以這個時候是沒有渲染到html模板中，所以通過dom訪問是訪問不到的。

圖上能打印出detail,其實打印出的不是detail組件的dom結(jié)構(gòu)，其實是home組件中的一個div,它的class='detail'

我說的不清楚，有大佬看到了可以說的明白點

2018年1月14日 02:15