关于vuex的自我理解

1.为什么要使用vuex

解决组件之间的 通信问题
方案有
1)常说的父子 子父组件之间的通信,问题:子组件是不可以改变父组件的数据
2) 借助第三方 :事件总线
给vue实例绑定一个事件总线 问题:通信 数据多 杂 不好管理
例如 this.emit('aaa',{}) this.emit('bbb",{})
3)于是乎,出现了第三方 状态池 state 把数据状态 扔到一个状态 池中

2. mutation 和 action的区别

类比如数据库,mutation是一次数据的读或者写
action 可以包含多个数据的读或者写,相当于事务的概念,即可以包含多个commit

mutation就是一次同步操作
ation可以包含任意异步操作

3.Getter 和 mutation

Getter相当于对state的get
mutation相当于对state的set
不能直接修改state的状态 ,避免同时去做类似于加减的操作

4.commit

commit 同步
都用commit修改数据,在改数据的那一刻,相当于锁定该操作

5.mapstate,mapGetter...等辅助函数

就是将state上的属性或者方法直接绑定在vue的实例上
通过this.XXX调用 而不是this.$store.XXX

vuex官网

6.关于state与vue data中的双向数据绑定

vuex的常用模式

当严格模式
用这种模式时,必须是值类型
如果是引用类型
则页面上data 的改变,会要去修改state的值
而state值只能有commit 修改
解决方案:官网 vuex中的表单处理
https://vuex.vuejs.org/zh/guide/forms.html

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 目录 组件化 组件通信 状态管理 Vuex 是什么 Vuex 有什么特点 Vuex 解决了什么问题 什么类型的数据...
    前端小华子阅读 6,041评论 0 16
  • 安装 npm npm install vuex --save 在一个模块化的打包系统中,您必须显式地通过Vue.u...
    萧玄辞阅读 7,998评论 0 7
  • 写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue...
    染陌同学阅读 5,564评论 0 12
  • vuex 场景重现:一个用户在注册页面注册了手机号码,跳转到登录页面也想拿到这个手机号码,你可以通过vue的组件化...
    sunny519111阅读 12,446评论 4 111
  • Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态,并以相应...
    白水螺丝阅读 10,108评论 7 61