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

1)可以直接使用 this.$store.state.变量 = xxx;
  2)this.$store.dispatch(actionType, payload)
       或者  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。

(该报错原因,请看源码:https://blog.csdn.net/zhq2005095/article/details/78359883 );

三.使用commit提交到mutation修改state的优点:

vuex能够记录每一次state的变化记录,保存状态快照,实现时间漫游/回滚之类的操作。
     (实际本人未用到,暂时未遇到使用该特性的需求)

结论: 官方要求最好设置严格模式,并且每次都要commit来修改state,而不能直接修改state,以便于调试等

vuex直接修改state 与 用commit提交mutation来修改state的差异的更多相关文章

  1. Git 实用操作:撤销 Commit 提交

    有的时候,改完代码提交 commit 后发现写得实在太烂了,连自己的都看不下去,与其修改它还不如丢弃重写.怎么操作呢? 使用 reset 撤销 如果是最近提交的 commit 要丢弃重写可以用 res ...

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

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

  3. 使用git命令修改commit提交信息

    很多时候我们在提交代码时可能会把commit提交信息写错了,这个时候我们就可以用到下面的git命令来修改commit提交信息 git commit --amend 输入"i"之后进 ...

  4. mutation中修改state中的状态值,却报[vuex] do not mutate vuex store state outside mutation handlers.

    网上百度说是在mutation外修改state中的状态值,会报下列错误,可我明明在mutations中修改的状态值,还是报错 接着百度,看到和我类似的问题,说mutations中只能用同步代码,异步用 ...

  5. 的Linq未提交之前插入/修改时重新查询不准确问题

    来园子已经两年了,每次都是看,这次咱也写一次. 说一下今天遇到的Linq问题: 每一次插入流水表时,都需要查找表中最大的流水号+1,并且将该流水号返回,但是在同一个SubmitChange之内插入多条 ...

  6. [No000091]SVN学习笔记2-TortoiseSVN Client初级操作update(获取)、commit(提交)

    SVN简介: 为什么要使用SVN? 程序员在编写程序的过程中,每个程序员都会生成很多不同的版本,这就需要程序员有效的管理代码,在需要的时候可以迅速,准确取出相应的版本. Subversion是什么? ...

  7. 6.Git内容修改之后的查看和提交

    我们已经成功地添加并提交了一个readme.txt文件,现在,是时候继续工作了,于是,我们继续修改readme.txt文件,改成如下内容: Git is a distributed version c ...

  8. Github上怎么修改别人的项目并且提交给原作者!图文并茂!

    Github上怎么修改别人的项目并且提交给原作者!图文并茂! 写这篇博客的初衷,是因为我的项目Only需要一些朋友一起参与进来,但是很多的Git都不是很熟练,其实版本控制这种东西没有什么难度的,只要稍 ...

  9. 规范git commit提交记录和版本发布记录

    在开发过程中我们一般都会用到git管理代码,在git commit提交代码时我们一般对git commit message随便写点简单的描述,可是随着项目参与人数的增多,发现提交的commit记录越来 ...

随机推荐

  1. Vue.js 关于双向绑定的一些实现细节

    Vue.js 是采用 Object.defineProperty 的 getter 和 setter,并结合观察者模式来实现数据绑定的. 当把一个普通 Javascript 对象传给 Vue 实例来作 ...

  2. js 监听音频视频控件是否播放

    监听onplaying: var myVideo=document.getElementById("video1"); myVideo.addEventListener(" ...

  3. PYTHON 100days学习笔记008-2:模块

    目录 Day008_02:模块 1.import语句 1.1from - import 语句 1.2 from - import * 语句 2.深入模块 2.1 __name__属性 2.2 dir( ...

  4. 原生js实现图片的3d效果

    <!doctype html><html lang="en"><head><meta charset="UTF-8"& ...

  5. Kernel--试题

    1. 内核堆栈区别: 1.栈自动分配回收,函数里面声明的变量:2.堆:malloc kmalloc申请的空间,需要自己释放 https://blog.csdn.net/tainjau/article/ ...

  6. php中连接tcp服务的三种方式

    首先需要现有一个 tcp 服务,我们使用 php中的 socket 系列函数实现 <?php //创建socket套接字 $socket = socket_create(AF_INET, SOC ...

  7. Python 【格式化字符串】

    print('血量:'+str(player_life)+' 攻击:'+str(player_attack)) 第一种格式化字符串 print('血量:%s 攻击:%s' % (player_life ...

  8. 怎样修改一个已存在的Cookie

    Cookie的修改也需要借助 Response-Header 的 Set-Cookie 字段, 不过需要注意的是: 待修改cookie的 key / domain / path / secure 必须 ...

  9. 基于C#实现与新大陆扫码枪通信

    随着工业互联的发展,扫码枪在很多场合都有所应用,超市.商场以及一些智能工厂.今天主要讲如何通过C#实现与新大陆扫码枪(OY10)进行通信,对于扫码枪的配置,这里就不多说了,结合说明书就可以实现.这里值 ...

  10. C# 使用Emit实现动态AOP框架 (一)

    目  录 C# 使用Emit实现动态AOP框架 (一) C# 使用Emit实现动态AOP框架 (二) C# 使用Emit实现动态AOP框架 (三) C# 使用Emit实现动态AOP框架 进阶篇之异常处 ...