To com um problema de estilização no VueJS. Através do v-for pego 3 botões da API, até ai tudo bem.O que eu preciso é que quando clicar em um dos 3 botões ele simplesmente altere a cor. Quando tento fazer essa transição de cor em UM botão, todos são afetados ! Queria um ideia de como fazer, lembrando que os botões não estão 'separados' tipo: < button > < button > < button >
<div class="form-group">
<label htmlFor="RequerenteId">Tabela</label>
<div name="requerente">
<button class="botaoBusca" v-for="item in tabela" :key="item.id" :value="item.id" v-on:click="filtraSelectBusca(item.id), isActive = !isActive" :class="{ 'btn-success': !isActive, 'btn-outline-danger': isActive }" >{{item.descricao}}
</button>
</div>
</div>
Enfim, preciso arrumar uma forma de aplicar a estilização em somente um botão, usando o data-v-xxxxx sei la .. Se tiverem algo relacionado ou ideia de solução, ficarei grato !!
isActive === true
os 3 botões receberão a classebtn-success
pois está programado para fazer assim. Você teria que ter umisActive
para cada botão para funcionar do jeito que você quer.