Vue中報(bào)錯“Error in onReady hook: "TypeError: Cannot read property 'setRules' of undefined"”
百度說“refs和ref名字不一致:把refs和ref名字保持一致就行了”夯膀,但是我這本來就是一致的,一直回退后發(fā)現(xiàn)客叉,組件在加v-if判斷之前都是正常的,沒有報(bào)錯褂痰,那么問題就在v-if處,把v-if改成v-show就可以了症虑。
vue的加載渲染缩歪,優(yōu)先渲染html代碼,此時js代碼還沒有執(zhí)行谍憔,所以動態(tài)屬性還沒有值匪蝙,因此被v-if包裹的代碼塊沒有被封裝,此時執(zhí)行js初始化代碼的時候习贫,調(diào)ref組件自然是undefined的逛球。而v-show會在加載html的時候加載完整代碼,只是不展示苫昌。
v-if和v-show的區(qū)別:
手段:v-if是通過控制dom節(jié)點(diǎn)的存在與否來控制元素的顯隱颤绕;v-show是通過設(shè)置DOM元素的display樣式,block為顯示祟身,none為隱藏奥务;
編譯過程:v-if切換有一個局部編譯/卸載的過程,切換過程中合適地銷毀和重建內(nèi)部的事件監(jiān)聽和子組件袜硫;v-show只是簡單的基于css切換氯葬;
編譯條件:v-if是惰性的,如果初始條件為假婉陷,則什么也不做帚称;只有在條件第一次變?yōu)檎鏁r才開始局部編譯(編譯被緩存?編譯被緩存后憨攒,然后再切換的時候進(jìn)行局部卸載); v-show是在任何條件下(首次條件是否為真)都被編譯世杀,然后被緩存,而且DOM元素保留肝集;
性能消耗:v-if有更高的切換消耗瞻坝;v-show有更高的初始渲染消耗;
基于以上區(qū)別杏瞻,因此所刀,如果需要非常頻繁地切換,則使用 v-show 較好捞挥;如果在運(yùn)行時條件很少改變浮创,則使用 v-if 較好。
原文鏈接:https://blog.csdn.net/bihaiyanyu/article/details/109216797