关于状态管理模式
作者:互联网
一个简单的 Vue 计数应用:
new Vue({ // state data () { return { count: 0 } }, // view template: ` <div>{{ count }}</div> `, // actions methods: { increment () { this.count++ } } })
该状态自管理应用包含以下几个部分:
-
state:驱动应用的数据源
-
view:以声明方式将 state 映射到视图
-
actions:响应在 view 上的用户输入导致的状态变化
以下是一个表示“单向数据流”理念的简单示意:
当遇到多个组件共享状态时,单向数据流的简洁性容易被破坏:
-
多个视图依赖于同一状态
-
来自不同视图的行为需要变更同一状态
因此,如果把组件的共享状态抽取出来,以一个全局单例模式管理,在这种模式下,组件树构成一个巨大的“视图”,不管在树的哪个位置,任何组件都能获取状态或触发行为,而且代码也会变得更结构化、易维护。
这就是 Vuex 背后的基本思想,Vuex 是专门为 Vue.js 设计的状态管理库,以利用 Vue.js 的细粒度数据响应机制来进行高效的状态更新。
标签:管理模式,Vue,状态,视图,state,关于,组件,view 来源: https://www.cnblogs.com/Leophen/p/11271713.html