吸气剂没有被正确调用答案

【问题标题】：getter not being called properly吸气剂没有被正确调用
【发布时间】：2021-04-02 03:53:51
【问题描述】：

我有一个带有向上/向下箭头的 Vue 组件，用于对评论进行投票，并且我在脚本类中有以下 getter：

    public get hasVotedUp(): boolean {
        console.log("== get hasVotedUp")
        ...

当页面加载时，由于模板中的:class="{ 'active-vote': hasVotedUp }" 而正确调用了getter（我可以在控制台中看到== get hasVotedUp）。我有另一个函数，一旦有人投票赞成评论就会被调用：

    private voteUp(): void {
        console.log("== voteUp pressed!")
        if (this.hasVotedUp) {
        ...

当有人按下 voteUp 时确实会被调用（我可以看到 == voteUp pressed! 正在登录控制台），但我在控制台中看不到 == get hasVotedUp。为什么？

【问题讨论】：

给我们一个最小的复制案例。没有比你给出的更多的代码或解释，这应该是有效的。需要注意的是，引起副作用的吸气剂通常是禁忌。
@JaredSmith 但console.log 在页面加载时似乎确实有效 - 我想这不是禁止的，而只是在吸气剂中产生副作用的反模式。或者，一旦页面完全加载，浏览器可能会禁止它......？
不太可能更像是一种约定。开发人员通常期望属性访问不会在远处引起幽灵般的动作，但我严重怀疑是否有任何实际执行。

【解决方案1】：

阅读文档Computed Caching vs Methods。

计算的属性是根据它们的反应依赖来缓存的。计算属性仅在其某些反应性依赖项发生更改时才会重新评估。

您可以尝试将您的计算 getter 更改为一个方法，该方法将确定是否是因为计算缓存，因为该方法每次都会运行。

【讨论】：