访问计算的 VueJS 的先前值

Posted 2023-02-16

【中文标题】访问计算的 VueJS 的先前值

【英文标题】：Access the previous value of computed VueJS

【发布时间】：2020-06-05 12:57:57

【问题描述】：

我正在使用计算来检查某些信息何时发生了变化。

当我单击并运行计算时，我可以看到数据中的新值和分配给计算函数的旧值。该值可通过 Chrome Vue 开发工具查看。

我想要做的是访问计算保存的数据，而不是返回。那是以前正确的数据，但计算更新了里面的回报。

我想这样做的原因是为了显示数据不再匹配并且发生了一些变化。

selectedLenses: "30626146713652" <-- Data
changeSelectedLenses: "28717846790196" <-- Computed

单击一个运行计算函数的按钮，它会变为：

selectedLenses: "28717846790196" <-- Data
changeSelectedLenses: "30626146713652" <-- Computed (Want to access this data saved to the computed function)

【参考方案1】：

如果您想观察变化，使用watch 可能是您的最佳选择。它处理 prev 和 next 值，您可以将其分配给观看您的计算...

new Vue(
    //...

    data() 
        return 
            selectedLenses: 0
        ;
    ,

    computed: 
        changeSelectedLenses() 
            return this.selectedLenses + 2;
        
    ,

    watch: 
        changeSelectedLenses(newValue, oldValue) 
            alert(`changeSelectedLenses computed property changed from $oldValue to $newValue`);
        
    
);

【讨论】：

我相信你所做的是正确的答案，现在研究如何将值已更改的事实保存到数据中，这有点复杂。因为我用它来告诉应用程序的其他部分值已更改。

您可以使用Vue.emit('myAction') 让父级知道（监听@myAction）或者，您可以使用Vuex 来管理全局状态。