How to change the color of a button inside a sub-menu using vue js3 and element-plus

Question

I've created a button in a sub-menu which when clicked should be able to change color

But whatever I do doesn't work.

This is the code for the button

I've added more code Link to Vue playground where you can find the code

Also i would like to change the color of the active checkbox to this rgba(134, 154, 31, 1)

This is how it is supposed to look I tried using checkbox it didn't also work out.

Answer 1

I think you should use :class for this case. Example:

<button 
  :class="isActive == true ? 'active' : ''" 
  @click="toggleActive"
> Active </button>