作用
父元件向子元件傳遞內容
插槽位置
vue.
component
('alert-box'
,)
定義
name
="header"
>
slot
>
solt
="header"
>
內容h1
>
還可以使用template標籤進行使用
template只是暫時包裹要顯示的內容，可以包裹多個，它不會顯示在頁面中
使用兩個相同具有相同名稱的slot可以顯示在頁面中 name這個有什麼用？？？
作用域插槽
應用場景：父元件對子元件的內容進行加工處理
插槽定義
>
v-for
="item in list"
v-bind:key
="item.id"
>
v-bind:item
="item"
>
}slot
>
li>
ul>
插槽內容
v-bind:list="list"是為了讓子元件可以使用父元件中的值 子元件中有props[『list』]
v-bind:list
="list"
>
slot-scope
="soltprops"
>
v-if
="slotprops.item.current"
>
}strong
>
template
>
fruit-list
>
//插槽（匿名插槽） 只需要傳遞一塊內容
//具名
還是插槽
插槽中要使用變數資料
變數資料來自於子元件內部
}
Vue元件插槽
三 具名插槽 命名插槽 補充當我們使用vue元件時，常常遇到子元件的部分布局在不同的路由元件上表現不同的情況，vue為了幫助我們開發者解決這個問題，新增了插槽這個功能 插槽即佔位符 實現元件在不同父元件中使用，內部可以有不一樣 塊 html 如下 示例 如下 示例 當乙個子元件內，需要多個插槽時，需...
Vue元件化之插槽
類似電腦的usb，使用介面給電腦增加不同的功能，鍵盤 音響，而不是直接在元件裡新增 介紹 預設自定義標籤內不允許新增內容，而插槽可以讓我們在內部新增內容 封裝方法 抽取共性，保留不同。使用方法 直接在template中插入slot空標籤，即可在自定義標籤中插入內容，內容會自動替換空slot 元件標籤...
vue的元件化開發（元件通訊，插槽，遞迴元件）
1.vue元件的通訊 包括子通父，父通子，兄弟通訊，祖代與後代通訊，vuex全域性狀態管理。1.1 父向子通訊 props屬性和refs屬性。1.1.1 props屬性 在子元件中 props age1 number,string 存在多種型別。在父元件中 1.1.2 refs屬性 通過this.r...