今日做項目淳地,需要用到vue中的作用域插槽著拭,因?qū)ψ饔糜虿宀鄣挠梅ú皇呛苁煜ぃ阏展倬W(wǎng)依葫蘆畫瓢用了起來衡怀。雖然都說vue好學(xué)易入門棍矛,但官方文檔有些地方介紹的確實有些晦澀難懂安疗。
通讀插槽相關(guān)說明可知,2.5.0+版本的作用域插槽在使用時可用任意標(biāo)簽以slot-scope='slopProps'的方式獲取子組件傳給作用域插槽的數(shù)據(jù)够委,此外荐类,也可用對象解構(gòu)的方法簡化用法。而2.0+到2.5.0之間的版本使用作用域插槽時必須用template茁帽,其它用法同2.5.0+版本玉罐。
因項目用的vue版本是2.3.4,自然就得用template來使用作用域插槽潘拨,可實際執(zhí)行起來吊输,卻老是獲取不到slot-scope=‘slotProps’中slotProps的值,控制臺報錯undefined铁追。明明跟官網(wǎng)寫法相同季蚂,結(jié)果卻不同。那么幾句代碼是看了一遍又一遍琅束,耗了一下午扭屁,最后才得知這兩不同版本間作用域插槽的使用卻別還有一個,那就是2.5.0+是用slot-scope變量接收子組件傳參的涩禀,而2.0+ ~ 2.5.0-版本確是用scope變量來接收子組件傳參疯搅,就這么一個小小的東西耗費了一下午的時間,實在是不知作何感想埋泵。
最后幔欧,只能以重要的事情說三遍來告誡自己:
2.0+ ~ 2.5.0-版本用scope變量來接收子組件傳參!
2.0+ ~ 2.5.0-版本用scope變量來接收子組件傳參丽声!
2.0+ ~ 2.5.0-版本用scope變量來接收子組件傳參礁蔗!