記錄一下：
今天（20170702）想記錄的不是常說(shuō)的基本類型、對(duì)象眷射、數(shù)據(jù)等類型的監(jiān)聽(tīng)，也不是記錄關(guān)于對(duì)象深度監(jiān)聽(tīng)方面的佛掖，這些都很直白妖碉，也因?yàn)楹艹Ｒ?jiàn)一般不會(huì)被忽略和出錯(cuò)。
今天想記錄一下芥被，在一個(gè)子組件中 watch 父組件傳遞過(guò)來(lái)的數(shù)據(jù)的問(wèn)題欧宜。主要的表現(xiàn)就是：有時(shí) watch 的回調(diào)沒(méi)有執(zhí)行，如果這邏輯跟頁(yè)面渲染有關(guān)拴魄，那么頁(yè)面就會(huì)有時(shí)沒(méi)有數(shù)據(jù)顯示冗茸，有時(shí)又正常顯示席镀。
下面分別記錄子組件 watch 父組件傳遞過(guò)來(lái)的數(shù)據(jù)的幾種情況：
第一種，子組件無(wú) v-if 指令控制：
父組件：
<div>
? ? <son? :son-data="sonData"></son>
</div>
<script>
? ??created() {
? ? ? ? this.doGetData()
? ? }
????async?doGetData(params)?{
??????const?{?success,?error?}?=?await?getData(params)
??????if?(success)?{
????????this.sonData=?success.data
??????}
????},
</script>
子組件：
<div>
? ? ? ?{{msg}}
</div>
<script>
? ? ?props：['sonData']
? ????watch:?{
????????????sonData(newVal,?oldVal)?{
??????????????this.msg = sonData.msg
????????????}
??????},
</script>
這種是比較簡(jiǎn)單的使用情況夏漱，也不會(huì)存在什么大的疑惑之處豪诲。watch，第一次就可以監(jiān)聽(tīng)到麻蹋。因?yàn)楦附M件是在?created 的鉤子中去請(qǐng)求數(shù)據(jù)跛溉，這時(shí)候父子組件的生命周期
第二中，子組件有 v-if 指令控制：
這種情況watch在監(jiān)聽(tīng)之前扮授，數(shù)據(jù)可能已經(jīng)傳入芳室，導(dǎo)致第一次watch沒(méi)有監(jiān)聽(tīng)到。如果彈窗打開(kāi)幾秒之后刹勃，數(shù)據(jù)再傳入堪侯，第一次也會(huì)監(jiān)聽(tīng)到。
簡(jiǎn)單記錄荔仁，也可能原因搞錯(cuò)了伍宦，需要用生命周期去驗(yàn)證。
