How to add class to parent in vue if input radio or ckebox is checked?

Question

Vue.js

Goodnight!
Can you please tell me how to add the active class to the parent (li or label) if the radio button or checkbox is active with such a structure?

<ol>
  <li class="list">
    <label>
      <input type="radio" value="category1" name="type" /><span>1</span>
    </label>
  </li>
  <li class="list">
    <label>
      <input type="radio" value="category2" name="type" /><span>2 </span>
    </label>
  </li>
</ol>

Thanks in advance!

Answer 1

When you activate the checkbox, you execute the method to which you pass, for example category2, then you assign the transferred value to any value from data. Then you write in Li - :class="{'active': value === 'categoty2' } ".
In general, it’s better to create an object with this data, display them in a loop and there will be many times less problems, they still have the same structure