Vuex

Vuex是一个专为 Vue.js 应用程序开发的状态管理模式

状态自管理应用包含以下几个部分:

  1. state : 驱动应用的数据源;

  2. view : 以声明方式将 state 映射到视图;

  3. actions : 响应在 view 上的用户输入导致的状态变化。

  单项数据流(如下图):

    

  当我们的应用遇到多个组件共享状态时,单向数据流的简洁性很容易被破坏,因此就会出现两个问题

    一、多个视图依赖于同一状态:传参的方法对于多层嵌套的组件将会非常繁琐,并且对于兄弟组件间的状态传递无能为力。

    二、我们经常会采用父子组件直接引用或者通过事件来变更和同步状态的多份拷贝。以上的这些模式非常脆弱,通常会导致无法维护的代码。

  综合一二描述,我们可以把组件的共享状态抽取出来,以一个全局单例模式管理,在这种模式下,我们的组件树构成了一个巨大的“视图”,不管在树的哪个位置,任何组件都能获取状态或者触发行为。

  Vuex的思想:通过定义和隔离状态管理中的各种概念并通过强制规则维持视图和状态间的独立性,我们的代码将会变得更结构化且易维护。

使用Vuex的优势:

  1.  vuex的存储状态是响应式

  2.  他是所有组件的状态集合

为什么要使用Vuex:

  Vuex 可以帮助我们管理共享状态,并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。

  如果您不打算开发大型单页应用,使用 Vuex 可能是繁琐冗余的。确实是如此——如果您的应用够简单,您最好不要使用 Vuex。一个简单的 store 模式就足够您所需了。但是,如果您需要构建一个中大型单页应用,您很可能会考虑如何更好地在组件外部管理状态,Vuex 将会成为自然而然的选择。

posted @ 2019-08-20 20:45  HelloWang2000  阅读(145)  评论(0编辑  收藏  举报