Intro
A '' tag is an HTML tag that allows there to be a placeholder inside a web component where you are able to place your own markup. It does this by creating separate DOM trees and then when the code is being run, presents them together.
In Use
My team and I are using slots within our web component of a card. The comp for the web component is show above. Our component is broken up into four parts:
- Icon
- Banner/Header
- Card
- Scaffold
We are using the '' tag help keep the different parts of the card flexible, like the header, sub-header, and body content so this web component can be reusable. To do this my team simple uses the name attribute as the parent element and the slot attribute as the child element. Below I have provided the link to my teams repo, so you can see examples of the '' tag in action. It is not completed yet, but progress is being made to make it as good as it can be.
Top comments (0)