使用 querySelector VueJS 连接变量答案

【问题标题】：Concatenating variable with querySelector VueJS使用 querySelector VueJS 连接变量
【发布时间】：2019-11-16 05:47:20
【问题描述】：

我正在尝试将 Vue 变量与 querySelector 中的 id 连接起来，但由于某种原因，它没有针对任何元素。

我目前正在使用：

document.querySelectorAll(".container:not(#`${this.id}`"));

this.id 只是一个字符串，不包含“#”，这就是我在这里将其添加到 querySelector 的原因

我在 DOM 中拥有的是：

<div id="header-1" class="container">
.......
</div>
<div id="header-2" class="container">
.......
</div>
<div id="header-3" class="container">
.......
</div>

【问题讨论】：

是否还有其他类为container的元素？你能显示标记吗？
是的，有..更新了我的帖子以显示 DOM 中的内容

标签： vue.js string-concatenation

【解决方案1】：

您应该考虑使用 'refs' 直接选择 DOM，而不是使用原生 javascript 和 CSS 选择器。

例如this.$refs[this.id]

https://vuejs.org/v2/api/#ref

【讨论】：