如何在vue中单击时更改按钮CSS类？ [英] How do I change a buttons CSS class when clicked in vue?

问题描述

单击该按钮可使初始类不是is-active类。有什么想法吗？



我尝试过：

< button class =initial：class ={'is-active'：activeTab === 1}name =button> START< / button> 

< style> 
 .is-active {
 color：blue 
} 
 
 .initial {
 color：red; 
} 
< style> 

解决方案

请尝试以下方法：

< pre lang =HTML> < 按钮 ：class = activeTab === 1？ 'is-active'：'initial' name = 按钮 > START < / button >

On click the button keeps the initial class not the is-active class. Any ideas?

What I have tried:

<button class="initial" :class="{'is-active': activeTab === 1}" name="button">START</button>

<style>
.is-active {
  color: blue
}

.initial {
color: red;
}
<style>

解决方案

Try the following:

<button :class="activeTab === 1 ? 'is-active':'initial'" name="button">START</button>

这篇关于如何在vue中单击时更改按钮CSS类？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！