Javascript 类名在VueJS方法中不起作用

我想更改“link”上的类的所有元素的类名。我使用的方法是通过单击元素来调用的。我测试了从函数中获取长度，这很好，但添加类却不行。有人知道为什么吗

HTML

<div id="app">
  <ul>
    <li><a href="#" class="link" @click="myFunc">Link text 1</a></li>
    <li><a href="#" class="link" @click="myFunc">Link text 2</a></li>
    <li><a href="#" class="link" @click="myFunc">Link text 3</a></li>
  </ul>
</div>

返回html元素的类似数组的对象，

.className

是此对象中每个元素的属性，您可以尝试以下操作：

document.getElementsByClassName('link')[0].className += " hullaballoo";

---

相反。

您正在尝试使用当前代码更改所有链接上的类

我的建议是：

event.currentTarget.classList.toggle('hullaballoo');

event.currentTarget将始终是您单击的链接

如果您希望在单击其中一个时将其全部“喧闹”，您可以执行以下操作：

<a v-for="link in 3" 
   href="#probably-actually-want-a-button"
   @click.prevent="allSelected = !allSelected"
   :class="{ hullaballoo: allSelected }">
   Link {{ link }}
</a>



但是，必须这样做并不是利用Vue。你想得太多了。理想情况下，您可能希望根据您所在的某些状态更改这些类。不过，您需要进一步澄清您的问题，以获得更好的答案。
接受的答案将返回文档中所有匹配的元素

如果您只想在组件中获得这些，可以这样做：

this.$el.getElementsByClassName('link')

谢谢，这是一种将类添加到所有这些元素的方法，也许可以使用forEach循环？谢谢，但我希望所有链接不仅仅更改currentTarget。我知道在Vue中有更简单的方法来实现这一点，但我发现Vue缺少修改dom的简单方法。因此，我试图评估如何执行在jQuery中容易但在Vue中困难的任务。我想在未来的项目中使用Vue，我希望用Vue取代jQuery，但我认为我可能仍然需要使用jQuery进行dom操作。使用Vue修改dom要容易得多，因为它直接绑定到数据。你可以做
Link{{Link}
，但你会发现这是一种没有韵律或理由的愚蠢行为。
<a v-for="link in 3" 
   href="#probably-actually-want-a-button"
   @click.prevent="allSelected = !allSelected"
   :class="{ hullaballoo: allSelected }">
   Link {{ link }}
</a>

this.$el.getElementsByClassName('link')