如何在 vue.js 脚本中访问"Id"

Question

我正在尝试访问此id="cm计数"；在vue.js脚本中使用"这个$参考文献cm_count.innerText"；但我无法得到所需的输出。所以我正在努力解决这个问题。如果我做错了，请让我知道如何访问这个"；Id"；和vue.js脚本中的css
html

<span id="cm_count" ref="cm_count">
({{ c_count }})
</span>

这是访问id"的正确方式吗；cm计数"；在vue.js中，还需要在vue.js脚本中使用.css
vue.js

this.$refs.cm_count.innerText ='('+ count +')';
this.$refs.cm_count.css('color', '#DB0038');

Answer 1

在JS中，我们选择项并对其进行操作。在Vue中，我们告诉项它应该如何应对一些更改并让一切运行。在极少数情况下，选择对象并更改其状态可能是必要的，但在您的情况下，您应该使用计算属性：

<span id="cm_count" ref="cm_count" :syle="spanStyles">
({{ c_count }})
</span>

computed: {
spanStyles() {
return `color:${this.c_count > 5 ? 'red' : 'black'}`;
}
}

评论后更新

按钮没有href属性。这就是为什么我认为你有一个链接。

<a href="linkTo" @click="doSomething">...</a>

data() {
return {
isButtonClicked: false
}
},
methods: {
doSomething() {
// you don't need to set a timeout here,
// but if it goes to the wrong link,
// you can use it to delay the changing of the link.
setTimeout(() => this.isButtonClicked = !this.isButtonClicked, 10
}
},
computed: {
linkTo() {
return this.isButtonClicked ? 'link1.com' : link2.com;
}
}