🔸fallback content

webcomponentslot ⟩ named slot

<slot> 內提供的預設內容。如果自訂的 web component 標籤內沒有提供任何內容,則會顯示預設內容。

用法

1️⃣ 在 template 中定義 <slot>,並提供預設內容:
<template id="my-component-template">
  <div class="container">
    <!-- ⭐️ 內含預設內容的 <slot> -->
    <slot>This is the default content if nothing is provided.</slot>
  </div>
</template>
2️⃣ 使用空的 component 標籤:
<my-component></my-component>

Last updated

Was this helpful?