vue.js中的插槽是Vue提出來的一個概念，正如名字一樣，插槽用于決定將所攜帶的內(nèi)容，插入到指定的某個位置，從而使模板分塊，具有模塊化的特質(zhì)和更大的重用性。

【相關(guān)文章推薦：vue.js】

什么是插槽？

插槽（Slot）是Vue提出來的一個概念，正如名字一樣，插槽用于決定將所攜帶的內(nèi)容，插入到指定的某個位置，從而使模板分塊，具有模塊化的特質(zhì)和更大的重用性。插槽顯不顯示、怎樣顯示是由父組件來控制的，而插槽在哪里顯示就由子組件來進(jìn)行控制

Vue slot 原理

在web-components中有slot的概念，https://developers.google.com/web/fundamentals/web-components/shadowdom。

<slot> 元素

Shadow DOM 使用 <slot> 元素將不同的 DOM 樹組合在一起。Slot 是組件內(nèi)部的占位符，用戶可以使用自己的標(biāo)記來填充。

通過定義一個或多個 slot，您可將外部標(biāo)記引入到組件的 shadow DOM 中進(jìn)行渲染。 這相當(dāng)于您在說“在此處渲染用戶的標(biāo)記”。

注：Slot 是為網(wǎng)絡(luò)組件創(chuàng)建“聲明性 API”的一種方法。它們混入到用戶的 DOM 中，幫助對整個組件進(jìn)行渲染，從而將不同的 DOM 樹組合在一起。

相關(guān)免費(fèi)學(xué)習(xí)推薦：javascript（視頻）