如何在vue中设置v-for的第一个元素的样式?
我想将一个active类设置为此代码中的第一个按钮:
<button
class='optional-red-outlined-btn'
v-for="(item, index) in faq"
:key="item._id"
@click="btnIndex = index"
>
{{ item.question }}
</button>
这意味着当页面加载时,如果其中有 4 个按钮,那么第一个按钮应该有optional-red-outlined-btn类和active类,而其他的只有optional-red-outlined-btn类。
当然,但我想当点击其他按钮时删除第一个按钮的活动,我只将它用于一个按钮有活动样式 button:focus{ background-color: $optional-red; 颜色:#fff; 但我想在默认的第一个按钮有这种风格
回答
您可以根据以下条件创建动态类
:class="{ active: index === 0 }"
如官方文档所示