改变状态
除了直接用 store.counter++
修改 store,你还可以调用 $patch
方法。 它允许您使用部分“state”对象同时应用多个更改:
store.$patch({
counter: store.counter + 1,
name: 'Abalam',
})
但是,使用这种语法应用某些突变非常困难或代价高昂:任何集合修改(例如,从数组中推送、删除、拼接元素)都需要您创建一个新集合。 正因为如此,$patch
方法也接受一个函数来批量修改集合内部分对象的情况:
cartStore.$patch((state) => {
state.items.push({ name: 'shoes', quantity: 1 })
state.hasChanged = true
})
这里的主要区别是$patch()
允许您将批量更改的日志写入开发工具中的一个条目中。 注意两者,state
和 $patch()
的直接更改都出现在 devtools 中,并且可以进行 time travelled(在 Vue 3 中还没有)。