[a] slot插槽
在開發中，我們經常遇到乙個模組中大部分內容相同，部分內容不一樣的情況，這個模組可以寫成乙個元件，
元件中相同的內容保留，不同的內容暴露在元件預留的插槽中，即可實現最優化**。
[b] 組建中插槽的使用
1. 讓我們封裝額元件更具有拓展性
2. 讓使用者可以決定元件內部的一些內容到底展示什麼
[c] 插槽的基本使用方法
1. 在元件模板中預留插槽
示例**：
這是元件1view code//預留乙個插槽
【注】此外，slot插槽中也可以寫預設值，當html頁面中未在插槽中填寫內容時，將顯示預設內容
如: 好啦
2. 在呼叫元件時，向插槽中加入自定義內容
如: //
這個按鈕將替換原模板中的slot標籤
view code
[d] 具名插槽
在乙個元件中，我們可以改變元件的多個地方，這裡我們就需要在乙個元件中加入多個插槽，
此時，我們需要給元件中的每個插槽設定乙個name屬性，以便於在html中在特定的那個插槽中填寫內容，
這些有name屬性的插槽，我們稱之為具名插槽
具名插槽的使用方法：
1. 在元件模板中加入多個插槽，並給每個插槽設定不同的name屬性
示例**：
這是元件1view code左邊中間
右邊
2. 在html頁面中使用元件時，在新增的內容的外標籤紅加入slot屬性，指定要新增到的那個插槽
示例**：
view code
[e] 編譯作用域
乙個元件在使用時，會呼叫一些屬性值，但是它只能呼叫自己的屬性值，即作用域在本元件內。
編譯作用域的官方準則：
父元件模板的所有東西都會在父級作用域內編譯；
子元件模板的所有東西都會在子級作用域內編譯；
案例1：
//view code1. html頁面元素
//這裡呼叫了isshow屬性
//全域性元件cpn的元件模板
這是元件1
【分析】
1. 在本案例中，頁面元素中呼叫了全域性元件cpn，並使用了isshow這個屬性
2. 但在本案例中，vue例項以及全域性元件中軍有isshow屬性
4. 因此，該html中呼叫的屬性值為vue例項中的isshow值
【筆者理解，不知是否正確】在定義元件中，vue例項才是乙個根元件，全域性元件為vue例項的最近子元件
[f] 作用域插槽
作用域插槽的作用是實現：父元件替換插槽的標籤，但是內容由子元件來提供
步驟：1. 在子元件的模板中設定插槽，並通過v-bind將需要傳遞的資料繫結在自定義的變數中，這個自定義的變數的值即為我們需要的子元件的資料
如：這是子元件
2. 在html頁面中呼叫vue例項中的子元件時，標籤內新增slot-scope="slot"，
在內部通過slot.自定義的變數，即可訪問子元件穿過案例的內容
例項：}*
【完整案例**】
//view codehtml頁面元素
2.在頁面中引用vue例項的子元件，在插槽中插入的內容中加入行內屬性slot-scope="slot"
//此後，在內部可以通過slot.data中訪問子元件的languages的資料了
for="item in slot.data">}*
//子元件的模板內容
這是子元件
//1. 在子元件模板定義的插槽中將languages資料傳過來，儲存在data中
vue插槽的使用
什麼是插槽？插槽 slot 是 vue 提出來的乙個概念，正如名字一樣，插槽用於決定將所攜帶的內容，插入到指定的某個位置，從而使模板分塊，且具有模組化的特質和更大的重要性，插槽顯不顯示 怎樣顯示是由父元件來控制的，而插槽在 顯示就由子元件來進行控制 用 slot 元素將不同的dom 樹組合在一起，s...
vue插槽的使用
父元件 父元件 呼叫子元件 color red 我預設插槽內容 p slotone1 div 子元件 vue.component soltonel 乙個元件中只能有乙個預設插槽。相對應的，具名插槽就可以有很多個，只要名字 name屬性 不同就可以了 父元件 父元件 呼叫子元件 footer styl...
Vue 插槽的使用
專案中具名插槽使用的較多。封裝的通用提示元件，如 上圖截的是登出提示，有的時候不同的情況下提示元件的提示內容不一樣，這就要根據具體情況更改 元件中的text內容 首先父元件使用prompt子元件 在向具名插槽提供內容的時候，我們可以在乙個元素上使用v slot指令，並以v slot的引數的形式提供其...