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

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

2.this.$store.dispatch(actionType, payload)

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

使用dispatch 和 commit的区别在于,前者是异步操作,后者是同步操作,所以 一般情况下,推荐直接使用commit,
 即 this.$store.commit(commitType, payload),以防异步操作会带来的延迟问题。

二. 异同点

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,以便于调试等。

vuex直接修改state 与 用dispatch/commit来修改state的差异的更多相关文章

  1. Vue Vuex中的严格模式/实例解析/dispatch/commit /state/getters

    严格模式 import getters from './getters' import mutations from './mutations' import actions from './acti ...

  2. Vue Vuex 严格模式+实例解析+dispatch/commit + state/getter

    1.严格模式 import getters from './getters' import mutations from './mutations' import actions from './ac ...

  3. Vuex入门实践(中)-多module中的state、mutations、actions和getters

    一.前言 上一篇文章<Vuex入门实践(上)>,我们一共实践了vuex的这些内容: 1.在state中定义共享属性,在组件中可使用[$store.state.属性名]访问共享属性 2.在m ...

  4. [React] Use the useReducer Hook and Dispatch Actions to Update State (useReducer, useMemo, useEffect)

    As an alternate to useState, you could also use the useReducer hook that provides state and a dispat ...

  5. Redhat修改主机名_Red hat怎么永久修改主机名hostname(转)

    有几种方式修改Redhat的主机名字,这些方法也适合其他的Centos系统,下面介绍Red hat怎么永久修改主机名hostname的三种方法. 方法一: 说明"hostname" ...

  6. 怎么修改电脑MAC地址 电脑MAC地址修改图文教程

    本文转载:http://www.45fan.com/a/Router/2677.html MAC地址是指电脑网卡的硬件地址,此地址一般烧录在网卡上.MAC地址工作在OSI七层模型的第二层,即数据链接层 ...

  7. 一键强制修改任意Mysql数据库的密码,修改任意环境Mysql数据库。

    本文采用我软件里面的内置改密功能,可以一键强制修改Mysql数据库的密码, 在修改过程中,会强制干掉Mysql主程序,修改完成后重新启动Mysql就可以了. 首先讲解如何一键强制修改PHPWAMP自身 ...

  8. Xcode里修改工程名、类名、批量修改变量名

    转:http://blog.csdn.net/yuedong56/article/details/13767001 一.修改工程名: 1.点击工程,右键,选择如图选项. 2.右侧如图位置,修改工程名. ...

  9. 团队项目系列博客 —— 在路上(之wampserver 修改根目录以及配置多站点以及修改端口号)

    团队项目系列博客 -- 在路上(之wampserver 修改根目录以及配置多站点以及修改端口号) 标签(空格分隔): wampserver php 参考:参考文献1.慕课网.知乎.github 一.w ...

随机推荐

  1. chrome谷歌浏览器开发者工具-网络带宽控制

    有时候我们想在本地测试一下图片预加载loading的加载情况,如下图: 可无奈一般网络带宽都比较好,基本上看不到效果,图片一下子就加载出来了, 可能这个时候有些小伙伴想到的办法是用定时器延迟加载 其实 ...

  2. [Swift-2019力扣杯春季决赛]4. 有效子数组的数目

    给定一个整数数组 A,返回满足下面条件的 非空.连续 子数组的数目: 子数组中,最左侧的元素不大于其他元素. 示例 1: 输入:[1,4,2,5,3] 输出:11 解释:有 11 个有效子数组,分别是 ...

  3. synchronized的四种作用域以及不能被继承解析

    synchronized是java中用于同步的关键字,其典型的作用域如下所示. 1 对象锁 @Slf4j public class SynchronizedExample1 { private fin ...

  4. ASP.NET Core 3.0 上的gRPC服务模板初体验(多图)

    早就听说ASP.NET Core 3.0中引入了gRPC的服务模板,正好趁着家里电脑刚做了新系统,然后装了VS2019的功夫来体验一把.同时记录体验的过程.如果你也想按照本文的步骤体验的话,那你得先安 ...

  5. springcloud~配置中心实例搭建

    server端 build.gradle相关 dependencies { compile('org.springframework.cloud:spring-cloud-config-server' ...

  6. 完美解决phpstudy安装后mysql无法启动(无需删除原数据库,无需更改任何配置,无需更改端口)直接共存

    PHPstudy与原Mysql兼容解决 一.前言 今天学习php,当然是要先安装好运行环境了,phpstyudy是一个运行php的集成环境, 一键安装对新手很友好,与时作为一个新手,便跟着教程安装了p ...

  7. Virtual Box虚拟机Ubuntu系统安装及基本配置

    Linux简介 什么是 Linux? Linux:世界上不仅只有一个 Windows 操作系统,还有 Linux.mac.Unix 等操作系统.桌面操作系统下 Windows 是霸主,而 Linux ...

  8. java 并发多线程显式锁概念简介 什么是显式锁 多线程下篇(一)

    目前对于同步,仅仅介绍了一个关键字synchronized,可以用于保证线程同步的原子性.可见性.有序性 对于synchronized关键字,对于静态方法默认是以该类的class对象作为锁,对于实例方 ...

  9. .net 笔试面试总结(3)

    什么是Sql注入?如何避免Sql注入? 用户根据系统的程序构造非法的参数从而导致程序执行不是程序期望的恶意Sql语句. 使用参数化的Sql就可以避免Sql注入. 数据库三范式是什么? 第一范式:字段不 ...

  10. 折腾Java设计模式之访问者模式

    博客原文地址:折腾Java设计模式之访问者模式 访问者模式 Represent an operation to be performed on the elements of an object st ...