vuex modules的用法

• 关于state、getters、actions的访问
• 注册、触发全局action
• 其他

---

关于state、getters、actions的访问：

• 直接访问

     this.$store.getters['tabsNav/allTabList']
     this.$store.state.tabsNav.tabList
     this.$store.dispatch('tabsNav/refreshPage', 1)

• 借助mapState、mapGetters、mapActions

     methods: {...mapActions('tabsNav', ['closeTabs', 'refreshPage'])}
     computed: {...mapState('tabsNav', {tabList: state => state.tabList})}
     computed: {...mapGetters('tabsNav', {allTabList: 'allTabList'})}

引入mapState, mapGetters, mapActions：

    1、import {mapState, mapGetters, mapActions}  from 'vuex'

    2、import {createNamespacedHelpers }  from 'vuex' ;

         const {mapState, mapGetters, mapActions} = createNamespacedHelpers('tabsNav')

注册、触发全局action

// modules actions  
test: {
    root: true,
    handler(context, payload) {
      console.log(context)
      console.log(payload)
    }
  }

// 触发
this.$store.dispatch('test', null, { root: true })

其他

context: ==》 {dispatch, commit, getters, state, rootGetters, rootState}

双向绑定的state 使用计算属性的setter、getter

严格模式：new Vuex.Store({strict: true})  （不用于发布环境）