Javascript 如何触发对添加到vuex存储的新值的处理?
我有一个存储条目的vuex存储:Javascript 如何触发对添加到vuex存储的新值的处理?,javascript,vue.js,vuex,Javascript,Vue.js,Vuex,我有一个存储条目的vuex存储: const store = createStore({ state() { return { entries: [ { id: 1, date-of-birth: "2020-10-15T14:48:00.000Z", name: "Tom", }, ], }; }, }); 我通过
const store = createStore({
state() {
return {
entries: [
{
id: 1,
date-of-birth: "2020-10-15T14:48:00.000Z",
name: "Tom",
},
],
};
},
});
我通过在计算属性中使用getter获得这些条目:
computed: {
entries() {
var entries = this.$store.getters.entries;
}
}
出于某种原因,我希望始终在存储中输出最新的出生日期。最初,我可以通过两种方式做到这一点:
- 通过创建额外的计算属性
最新出生日期
- 只需添加一个新的
数据
变量最新出生日期
,该变量在(例如)挂载前挂钩中设置
但是,当我(通过应用程序)添加一个新条目时,这两种方法都不会更新最新出生日期
,因为只有计算属性条目
被触发
我试图用两种方法解决这个问题:
- 当我尝试在计算出的
属性
条目
,有人建议我不要像看上去那样做
错误实践(计算属性中没有副作用)
- 此外,监视计算属性
条目也不起作用;
显然,这只适用于数据变量
因此,我的问题是:在向存储添加(或从存储中删除)值后,如何更新最新的出生日期
谢谢 您只显示vuex对象的状态
属性。我假设您也在使用mutation
属性来设置内部值
如果是这样,您所要做的就是在一个突变上设置多个状态,并且它们都将在您的计算值中更新,如下所示:
const store=新的Vuex.store({
声明:{
条目:[]
lasentrie:null
},
突变:{
附录(州、中心){
state.entries.push(entrie);
state.lastEntrie=entrie;
}
}
})
然后,在您的计算值中:
计算:{
髓鞘(){
返回此项。$store.state.entries
}
LastEntrie(){
返回此项。$store.state.lastEntrie
}
}
您只显示vuex对象的状态
属性。我假设您也在使用mutation
属性来设置内部值。如果是这样的话,如果在一个突变上设置多个状态,它们都将在您的计算值中更新,因为它不完全是我要保存在变量中的最新条目,而是所有保存条目中的最新日期(可能是新添加条目的日期不是最新的(或最年轻的)),我需要(1)在开始和(2)在状态的每次更改(添加/更新/删除条目)后进行此计算。您的解决方案能否适应此问题?(我看到我用这个评论扩展了我的问题-很抱歉,非常感谢您的帮助!!)addEntrie
属性是一个函数,您可以在其中执行任何同步操作。因此,您可以交互洞状态。条目并搜索最后一个。注意,这只是一个函数完成的!我现在用store.commit()
调用突变,如下所述: