我只想将1个特定的nav-item更改为红色(如果选中),这意味着其他项将保持蓝色,并且只有特定的nav-itm的颜色将更改(如果选中)。
示例条件如下所示:if(this.tabid===3 && active) { background color:red; }
<b-navbar-nav class="mx-auto row nav-slot-custom-bar">
<template v-for="(item, i) in menus">
<b-nav-item
:href="item.href"
class="col"
@click="changeTab(item.tabid)"
:class="{'active': selectNav == item.tabid}"
:key="i">
<b-row class="text-center mb-1 nav-btm-icon" :class="{'active': selectNav == item.tabid}">
<img
:src="item.icon"
aria-hidden="true"
class="mx-auto"
style="width: 31px; height: 31px;"
:class="{ 'active': selectNav == item.tabid }"
/>
</b-row>
</b-nav-item>
</template>
</b-navbar-nav>
1条答案
按热度按时间qzwqbdag1#
你可以像这样添加条件类,然后我会添加一个类,它包含你想要的属性: