How to replace one style class with another in vue.js?

Question

css

Started learning vue.js.
My eyes are blurred and I can no longer reason and study objectively, logically. Maybe it just doesn't get through.
Can't change class on click. Add class adds. I can't replace. Well, or delete after adding.
I re-read the documentation up and down, apparently I already drove myself. but I can't solve the problem. Tell me how to remove or change the style class when clicking on a link/button.
ps I understand that the question is extremely simple. But I can't get over

Answer 1

<div id="app">
  <div :class="{ active }"></div>
  <button @click="active = !active">Toggle Active</button>
</div>

new Vue({
  el: '#app',
  data() {
    return {
      active: false,
    }
  }
})