Vue.js - 点击事件添加类

Question

我想在Vue.js中实现动态切换div类的功能，而不使用属性/数据来实现。这是我的div：

```html

```

当点击此div时，我希望添加类quiz-item--correct或quiz-item--incorrect（此逻辑将在其他地方处理）。由于问题的答案太多了，使用属性不是可维护/可行的方法。请问有什么办法可以实现这个功能吗？

- Adam McKenna

Answer 1

你可以像这样做：

<div class="quiz-item" @click="$event.target.classList.toggle('classname')">

你可以查看演示这一点的fiddle：这里。

- abhishekkannojia

---

我认为classList不被所有浏览器支持，特别是IE。 - victor

@victor 是的，IE < 10不支持classList方法。但是如果你想支持这些浏览器，你可以使用解决方法，比如调用一个函数并在那里操作类。 - abhishekkannojia

嗯...有点可行...但很遗憾对我没用...现在，当在具有此侦听器的 div 中存在一个 span 或另一个 div 或其他东西时。当我点击元素时，子元素会获得打开类。而不是元素本身... - TheLD

如果你在div中嵌套了可以接收点击事件的元素，你可能需要将点击处理程序更改为$event.currentTarget.class...。 target指的是事件发生的元素，在你的情况下可以是任何子元素，而currentTarget将指向绑定事件处理程序的元素。希望这可以帮助你。 - abhishekkannojia