Currently, I am delving into the world of Vue and facing some challenges when it comes to grasping the concept of slots.
In my project, I have two components:
- BaseIcon
<template>
...
<slot name="test"></slot>
...
<template/>
- EventCard
<template>
<router-link class="event-link" :to="{ name: 'event-show', params: {id: '1'}}">
..
<BaseIcon name="users" slot="test">{{ event.attendees.length }} attending</BaseIcon>
..
</router-link>
</template>
However, I am encountering an issue where the content inside the "slot" within the BaseIcon tags in EventCard is not being replaced as expected.