1,用法一:slot作為標籤使用
父元件:我不應該顯示出來
子元件:slotchild.vue理論上父元件裡應該寫,以上的**即使中間插入了其他內容也是無效的,不顯示。我應該顯示的
為了能夠顯示中間的內容,使用slot即可:
子元件:slotchild.vue這樣,父元件就可以往中間插入了,且內容顯示在的位置。我應該顯示的
2,用法二:slot作為屬性使用
開心希望的效果是大海中間有空格:大 海 ,但是實際列印的效果是:大 海,也就是說屬性中是不允許以 的方式新增空格的,這個時候使用slot代替label屬性的內容:
這個時候就能正常顯示 「大 海」 的提示標籤了,此時slot的作用相當於代替父級標籤的某個屬性值大 海
開心
Vue中的slot插槽
前言 之前學vue對插槽只有乙個模糊的存值概念,最近在封裝自定義元件時,再次學習一下。通過slot插槽向元件內部指定位置傳遞內容,通過slot可以父子傳參,簡化了進行自定義元件的封裝和使用。自己對插槽理解 就是乙個站位html模板,用來攜帶內容,插入到合適的位置,由父元件來決定其顯示的內容,使得模組...
vue中的slot(插槽)
1 slot 基本用法 插槽指允許將自定義的元件像普通標籤一樣插入內容 import vue from vue 定義元件componentone const compoentone 呼叫元件 newvue el id data template 使用插槽 2 具名插槽 給具體的插槽命名,並在使用的時...
Vue中的插槽 slot
一 什麼是插槽?二 怎麼用插槽?2.1預設插槽 子元件 template div class slotcontent ul li v for item in items li ul div template script export default script style scoped styl...