During our class sessions, we discussion various ways that we can leverage using <slot>
for the web components project. We are supposed to use slot to various dynamic customizations to the card as shown below
What is slot composition
Slot composition is used to pass code through elements. Code from things like the icon or the header of the card can be passed through. Slotting gives you the ability to pass dynamic content between different elements that you create, while supporting the ability to structure the rendered HTML and content however you see fit!
Application
For this project, our group is using the <slot>
to make the card more dynamic and flexible. The <slot>
acts a placeholder in web components that you can then populate with any mark up you would like. This allows for flexibility when creating different web components.
Examples
The screenshot below shows a good example of how to implement the slot tag in your code.
Top comments (0)