vue中v-if无法实现问题

想用v-if和v-else让这两个插槽在不同状态的时候显示出来，然而v-if不起作用，两个插槽同时显示(理想效果应该是活跃显示第二个，不活跃显示第一个)，

按道理来说，这步之前的步骤应该都是没有问题的 不然插槽应该也加载不出来。而且我设置样式文字字体红色，也没有效果。小白不知道怎么解决了，求大神帮一下忙，因为案例对以后学习还有作用，所以卡了好久了

直接使用三目运算判断name呗，渲染一个插槽就好了，还v-if写俩，不嫌麻烦吗...

<slot :name="isActive?'item-icon-active':'item-icon'"></slot>

改为v-if ="isActive === false"

使用<div v-if>

<div v-else>

来操作这两个 把他们放进去 合成只使用一次if else

其实你这个是具名插槽，只要控制显示那个name的插槽就行。你这个写法得意思是isActive==false的时候显示item-icon反之显示另一个。

如我你只是实现下面的效果的  没有必要写那样写  感觉看不懂   ，下面是最好的！

可以给我个采纳吗，谢谢!! 点击我这个回答右上方的【采纳】按钮

<template>
  <div class="tab-bar-item">
    <div class="{'active':isActive}">
      <slot></slot>
    </div>
  </div>
</template>

您好，我是有问必答小助手，您的问题已经有小伙伴解答了，您看下是否解决，可以追评进行沟通哦~

如果有您比较满意的答案 / 帮您提供解决思路的答案，可以点击【采纳】按钮，给回答的小伙伴一些鼓励哦～～

ps:问答VIP仅需29元，即可享受5次/月 有问必答服务，了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632