vuex直接修改state 与 用dispatch/commit来修改state的差异

一. 使用vuex修改state时,有两种方式:

.可以直接使用 this.$store.state.变量 = xxx;

this.$store.dispatch(actionType, payload)
或者:` this.$store.commit(commitType, payload)`

区别:使用dispatch 和 commit的区别在于,前者是异步操作,后者是同步操作,所以 一般情况下,推荐直接使用commit,
即 this.$store.commit(commitType, payload),以防异步操作会带来的延迟问题。
dispatch匹配action方法,commit匹配mutations方法
二. 异同点
1.共同点: 能够修改state里的变量,并且是响应式的(能触发视图更新)

2.不同点: 若将vue创建 store 的时候传入 strict: true, 开启严格模式,那么任何修改state的操作,只要不经过
mutation的函数,vue就会 throw error : [vuex] Do not mutate vuex store state outside mutation handlers。

三.使用commit提交到mutation修改state的优点:
vuex能够记录每一次state的变化记录,保存状态快照,实现时间漫游/回滚之类的操作。
小计:官方推荐最好设置严格模式,并且每次都要commit来修改state,而不能直接修改state,以便于调试等

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值