Javascript 插槽未显示-Vue.js

我现在正在学习vue，在理解插槽时遇到问题

我有两个部分：

BaseIcon

...
...

事件卡

..
{{event.attendes.length}参加
..

---

但是在

EventCard

中，“slot”并没有被

BaseIcon

组件标记中的内容替换，您可以像

v-slot

一样使用它，因为

slot

语法如前所述已被弃用：

{{event.attendes.length}参加

或速记：

 <BaseIcon name="users" >
    <template  #test>
    {{ event.attendees.length }} attending
   </template>
</BaseIcon>

{{event.attendes.length}参加

指定的v形槽只能在模板中使用。默认值也可以在组件中使用。见文件：

此外：

请注意，与不推荐使用的插槽属性不同，v-slot只能添加到（有一个例外）。

---

我最近也有类似的问题。结果发现我的HTML标记中有一个小故障（我没有关闭一个粗体标记）。据推测，将模板HTML转换为Javascript脚本的Vue例程对此类故障极为敏感（与多年来一直擅长处理这些问题的浏览器不同），因此模板一直在默默地失败

我不得不用一个艰苦的“分而治之”的过程来追踪它——把所有的东西都切掉，然后一点一点地贴回去。但是可能会有语法检查器来彻底分析模板标记

---

值得检查。

不，这也是问题所在。请检查我编辑的答案，我在按钮内使用了模板。因此，您认为我应该怎么做？

<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>

 <BaseIcon name="users">
   <template  v-slot:test>
    {{ event.attendees.length }} attending
   </template>
</BaseIcon>

 <BaseIcon name="users" >
    <template  #test>
    {{ event.attendees.length }} attending
   </template>
</BaseIcon>