美文网首页
vuex与store

vuex与store

作者: POLOCY | 来源:发表于2019-03-26 16:11 被阅读0次

    Store=State+Mutation

    1 .State(与store的区别):

    每当 store.state.count 变化的时候, 都会重新求取计算属性,并且触发更新相关联的 DOM。然而,这种模式导致组件依赖全局状态单例。在模块化的构建系统中,在每个需要使用 state 的组件中需要频繁地导入,并且在测试组件时需要模拟状态。Vuex 通过 store 选项,提供了一种机制将状态从根组件“注入”到每一个子组件中,且子组件能通过 this.$store 访问到。

    mapState 辅助函数:当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题,我们可以使用 mapState 辅助函数帮助我们生成计算属性

    2.Getter

    从 store 中的 state 中派生出一些状态.

    所解决问题:如果有多个组件需要用到此属性,我们要么复制这个函数,或者抽取到一个共享函数然后在多处导入它

    mapGetters 辅助函数

    mapGetters 辅助函数仅仅是将 store 中的 getter 映射到局部计算属性

    3.Mutation(必须为同步函数)

    类似于事件:每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler)

    store.commit:调用

    在组件中提交 Mutation

    你可以在组件中使用 this.$store.commit('xxx') 提交 mutation,或者使用 mapMutations 辅助函数将组件中的 methods 映射为 store.commit 调用

    4.Action(解决异步)

    Action 提交的是 mutation,而不是直接变更状态。

    Action 可以包含任意异步操作

    store.dispatch :分发 Action,Action  的触发方法

    在组件中分发 Action

    你在组件中使用 this.$store.dispatch('xxx') 分发 action,或者使用 mapActions 辅助函数将组件的 methods 映射为 store.dispatch 调用

    5.Module

    将 store 分割成模

    相关文章

      网友评论

          本文标题:vuex与store

          本文链接:https://www.haomeiwen.com/subject/cnngpqtx.html