How to make a class added and removed with v-for only on click on this element?

Question

Vue.js

How to make a class added and removed with v-for only on click on this element? I tried here , but it turned out that if I click on another element, then the open one closes, and I need it to close only if I click on it

Answer 1

Add to each element of the array a property responsible for the presence of a class:

todos: [
  { open: false, ... },
  { open: false, ... },
  ...
],

Toggle the value of this property on click:
@click="todo.open = !todo.open"
Assign a class depending on the value:
:class="{ 'dropdown-active': todo.open }"
https://jsfiddle.net/2ef8yojn/