當需要讓元件組合使用，混合父元件的內容與子元件的模板時，就會用到slot，這個過程叫做內容分發。
1、slot內容分發
在子元件內使用特殊的元素就可以為這個子元件開啟乙個slot（插槽），在父元件模板裡，插入在子元件標籤內的所有內容將替代子元件的標籤及它的內容。例如：
更多分發的內容
沒有name屬性的slot將作為預設slot出現，父元件沒有使用slot特性的元素與內容都將出現在這裡；如果沒有指定預設的匿名slot，父元件內多餘的內容片段都將被拋棄。例如：
正文內容
更多的正文內容
底部資訊
以上**中，類名為main的div裡面的slot沒有name屬性，是預設的slot，顯示的內容正是子元件child-component裡的兩個沒有slot屬性的p標籤裡面的內容；子元件內的備用內容，它的作用域是子元件本身。
2、作用域插槽
作用域插槽是一種特殊的slot，使用乙個可以復用的模板替換已渲染元素。例如：
來自父元件的內容
}
作用域插槽更具代表性的用例是列表元件；允許元件自定義應該如何渲染列表每一項。例如：
}3、訪問slot
通過$slot可以訪問某個具名slot，this.$slots.default包括了所有沒有被包含在具名slot中的節點。例如：
正文內容
更多正文內容
底部資訊
vue2 X基礎知識七之 nextTick
獲取div內容 選擇元素 data 通過事件觸發 methods 上面 執行後，會丟擲乙個錯誤 cannot read property innerhtml of null 這裡涉及到乙個重要的概念 非同步更新佇列。vue在觀察到資料變化時並不是直接更新dom，而是開啟乙個佇列，並緩衝在同一事件迴圈...
Vue2 x 插槽slot用法
指令 v shot 說明 插槽就是子元件中的提供給父元件使用的乙個佔位符，用 表示，父元件可以在這個佔位符中填充任何模板 如 html 元件等，填充的內容會替換子元件的標籤 使用示例 子元件 子元件自定義按鈕 父元件引入使用 這時頁面顯示 當父元件未傳任何內容時，則預設編譯子元件中的內容。如果在父元...
vue2 x知識總結
data data data data 逆轉訊息 data methods data 現在我們為每個 todo item 提供 todo 物件 todo 物件是變數，即其內容可以是動態的。我們也需要為每個元件提供乙個 key 稍後再 作詳細解釋。vue.component todo item dat...