计算属性未从 Vuex 存储对象更新

dan*_*mix 6 vue.js vuex

我有一堆类绑定语句:

:class="{active: isActive('status', status.id)}"
Run Code Online (Sandbox Code Playgroud)

这是上面提到的方法:

isActive: function (param, value) {
    if (!this.activeFilters.hasOwnProperty(param) && value === 'all' && param !== 'type') {
        return true;
    }
...etc
}
Run Code Online (Sandbox Code Playgroud)

...以及该方法正在查看的计算属性:

activeFilters() {
    return this.$store.state.activeFilters;
},
Run Code Online (Sandbox Code Playgroud)

哪个处于 Vuex 状态。

问题是,当单击具有上述类绑定的下拉列表之一时,这些属性不会更新。如果我导航到另一条路线然后返回,则活动类已被很好地应用。我可以强制计算属性重新计算以便立即应用该类吗?

我知道添加属性不会触发反应性,但根据this,如果我用新的对象替换对象,则应保持反应性。好吧,这就是我正在做的事情:

state.activeFilters = query;
Run Code Online (Sandbox Code Playgroud)

...更换对象。我难住了。

dan*_*mix 0

弄清楚了。在我的函数之后,我需要它来强制组件重新渲染:

this.$forceUpdate();
Run Code Online (Sandbox Code Playgroud)