关于 vuex 的使用忠告
第一、看明白这张图在说话

简单解释一下,actions接收到components的行为后actions请求api 等获取数据,提交到mutations,然后mutations中才改变state ,反映到视图中。进而完成状态的管理。简单吧。
第二、另外两个核心内容
getter (当状态在多个component中都在进行相同的处理的时候使用),
module(把store 分割成模块,每个模块拥有自己的 state、mutation、action、getter、甚至是嵌套子模块,解决store对象臃肿的问题)
第三、state的获取方式
- 通过状态直接获取(不建议使用)
computed: { msg() { return this.$store.state.msg } }
- 通过属性访问(getter 在通过属性访问时是作为 Vue 的响应式系统的一部分缓存其中的。)
computed: { msg() { return this.$store.getters.msg} }
- 通过方法访问(getter 在通过方法访问时,每次都会去进行调用,而不会缓存结果)
store.getters.getMsg(“合理使用参数”)
- mapGetters辅助函数访问(mapGetters仅仅是将 store 中的 getter 映射到局部计算属性:)
computed: {...mapGetters([ 'msg'... ]) }
其他使用细节
改变数据只通过Action 提交(commit)到mutation中修改state
建议:在action中进行数据操作
getter中做数据过滤
以下非常非常重要:
只有在组件中需要共享的数据才使用vuex,不要什么都使用这个玩意
现在大概就这些
关于 vuex 的使用忠告的更多相关文章
- vuex - 项目结构目录及一些简单配置
首先先正经的来一段官网的"忠告": vuex需要遵守的规则: 一.应用层级的状态应该集中到单个 store 对象中. 二.提交 mutation 是更改状态的唯一方法,并且这个过程 ...
- vue2.0 --- vuex (一)
之前做vue项目中没有使用vuex 一直使用vue-router 组件.路由一直的转换,烦不胜烦 今天研究一下vuex vuex是什么: vuex是专门为vue.js应用程序开发的状态管理模式. 解 ...
- 关于Vue.js 2.0 的 Vuex 2.0,你需要更新的知识库
应用结构 实际上,Vuex 在怎么组织你的代码结构上面没有任何限制,相反,它强制规定了一系列高级的原则: 应用级的状态集中放在 store 中. 改变状态的唯一方式是提交mutations,这是个同步 ...
- vuex复习方案
这次复习vuex,发现官方vuex2.0的文档写得太简略了,有些看不懂了.然后看了看1.0的文档,感觉很不错.那以后需要复习的话,还是先看1.0的文档吧.
- vuex 初体验
vuex是vue的状态管理工具,vue进阶从es6和npm开始,es6推荐阮一峰大神的教程. vuex学习从官方文档和一个记忆小游戏开始.本着兴趣为先的原则,我先去试玩了一把-->. Vuex ...
- vuex(1.0版本写法)
Vuex 是一个专门为 Vue.js 应用所设计的集中式状态管理架构. 官方文档:http://vuex.vuejs.org/zh-cn/ 2.0和1.0都能在此找到 每一个 Vuex 应用的核心就 ...
- 关于Vue vuex vux 文档
01. vue 链接 http://vuejs.org.cn/guide/ 02. vuex ----->>状态管理模块儿<<------- https://vuex.vue ...
- vuex
英文:(Introduction)中文:https://github.com/vuejs/vuex/issues/176(贡献者努力中)
- Vue 2.0 + Vue Router + Vuex
用 Vue.js 2.x 与相配套的 Vue Router.Vuex 搭建了一个最基本的后台管理系统的骨架. 当然先要安装 node.js(包括了 npm).vue-cli 项目结构如图所示: ass ...
随机推荐
- gitlab升级迁移(二)
前面我们写了一篇gitlab升级迁移的文章(https://www.cnblogs.com/liangyou666/p/9434158.html),这次我们主要是讲另一种升级迁移方法和其中遇到的一些问 ...
- Contest2161 - 2019-3-21 高一noip基础知识点 测试4 题解版
传送门 预计得分:100+100+100+10=310 实际得分:100+0+82+10=192 你们基础知识不行啊——by wxg T1 一看数据范围就是搜索 但是不能因为数据范围就断送了dp的心 ...
- django登录
一. form表单使用注意事项: 1. action="" 提交地址, method='post' 请求方式 2. input 标签要有name属性才能被获取 3. 有一个inpu ...
- Lua中的一些库(2)
[前言] 在<Lua中的一些库(1)>这篇文章中,总结了一部分Lua中的库函数,一篇文章肯定是总结不完的,所以,就来一个<Lua中的一些库(2)>.希望大家能忍住.来吧. 操作 ...
- PHP生成HTML文件, SummerHtml
2018-6-27 20:13:04 星期三 作用: 用PHP生成HTML文档, 支持标签嵌套缩进 起因: 这个东西确实也是心血来潮写的, 我很满意里边的实现缩进的机制, 大家有用到的可以看看 现在都 ...
- Python--抽象类接口类
一. 继承有两种用途: """ 一:继承基类的方法,并且做出自己的改变或者扩展(代码重用) 二:声明某个子类兼容于某基类,定义一个接口类Interface,接口类中定义了 ...
- Okhttp同步请求源码分析
进阶android,OKhttp源码分析——同步请求的源码分析 OKhttp是我们经常用到的框架,作为开发者们,我们不单单要学会灵活使用,还要知道他的源码是如何设计的. 今天我们来分析一下OKhttp ...
- javascript中字符串的方法
字符串的方法 charAt();返回字符串指定索引的字符: concat();连接两个或多个字符串: indexOf();返回字符串中检索指定字符第一次出现的位置: lastIndexOf();返回字 ...
- 【batch】命令对比两个文件夹下的文件(增删改的对比)
1.分别打印两个目录的结构 TREE D:\SOURCE /A /F >D:\SOURCE.TXT TREE D:\DEST /A /F >D:\DEST.TXT 2.然后使用工具/命令进 ...
- java 利用jsoup 爬取知乎首页问题
今天学了下java的爬虫,首先要下载jsoup的包,然后导入,导入过程:首先右击工程:Build Path ->configure Build Path,再点击Add External JARS ...