vuex学习一

来源:互联网 发布:安能久事笔砚间乎翻译 编辑:程序博客网 时间:2024/05/21 09:39

一:
1:npm安装

cnpm install vuex --save

2:必须以插件的方式进行引用

import Vuex from 'vuex'Vue.use(Vuex)

二:Vuex是什么?
单项数据流理念示意图:
这里写图片描述
但是,当我们的应用遇到多个组件共享状态时,单项数据流的简洁性很容易遭到破坏:
(1)多个视图依赖于同一个状态
(2)来自不同视图的行为需要变更同一个状态
对于问题一,传参的方法对于多次嵌套的组件将会非常繁琐,并且对于兄弟组件之间的状态传递无能为力。对于问题二,我们经常会采用父子组件直接引用或者通过事件来变更跟同步状态的多份拷贝;这2种方式的模式都非常脆弱,通常会导致无法维护的代码;
VUEX背后的基本思想:把组件的共享状态抽取出来,以一个全局单例模式管理;在这种模式下,我们的组件树构成了一个巨大的视图;不管在树的那个位置,任何组件都能获取状态或者触发行为!
另外,通过定义隔离状态管理中的各种概念并且强制遵守一定的规则,我们的代码将会变得更结构化并且维护;
(借鉴了Flux、Redux、The Elm Architecture,与其他模式不同的是,vuex是专门为vue.js设计的状态管理库,以利用vue.js的细粒度数据相应机制来进行高效的状态更新)
这里写图片描述
三:什么情况下使用VUEx?
VUEx虽然可以帮助我们管理共享状态,但也附带了更多的概念跟框架,需要对短期跟长期效益进行权衡;
不过不打算开发大型单页面应运,使用VUEX可能是繁琐冗余的;如果应用够简单,最好不要使用Vuex。一个简单的global event bus就足够所需了;但是,如果您需要构建的是一个中大型应运,您很可能会考虑如何更好的在组件外部管理状态,vuex将会成为自然而然的选择,

原创粉丝点击