Vuex Compose

API

mapStateToProps

alias: withState

(
  namespace?: string,
  map:  Array<string> | { [key]: string | Function },
) => (Component) => Component

Maps state to props, effectively the same as using Vuex's mapState within your component.

Namespacing is slightly different to mapState. If you have a module where namespaced: false, you can still provide a namespace to drill down into the module's state.

mapStateToProps('myModule', {
  myPropName: 'myStateValue',
});

mapGettersToProps

alias: withGetters

(
  namespace?: string,
  map: Array<string>,
) => (Component) => Component

mapGettersToComputed

(
  namespace?: string,
  map: Array<string>,
) => (Component) => Component

mapMutationsToHandlers

alias: withMutations

(
  mutations: {
    [key]: string,
  },
) => (Componet) => Component

Maps mutations to event handlers. When the specified key is emitted, the mutation will be committed with the provided payload.

compose(
  mapMutationsToHandlers({
    submit: 'SUBMIT',
  }),
  lifecycle({
    created(){
      this.$emit('submit', this.payloadValues);
    },
  }),
)

mapActionsToHandlers

alias: withActions

(
  namespace?: string,
  map: {
    [key]: string,
  },
) => (Component) => Component

mapActionsToMethods

(
  namespace?: string,
  map: {
    [key]: string,
  },
) => (Component) => Component

mapActionsToProps

(
  namespace?: string,
  map: {
    [key]: string,
  },
) => (Component) => Component

mapActionCreatorsToHandlers

alias: withActionCreators

(
  map: {
    [key]: Function,
  },
) => (Component) => Component

mapActionCreatorsToMethods

(
  map: {
    [key]: Function,
  },
) => (Component) => Component

mapActionCreatorsToProps

(
  map: {
    [key]: Function,
  },
) => (Component) => Component

connect

(
  namespace?: string,
  mapStateToProps?: Array<string> | { [key]: string | Function },
  mapActionsToHandlers?: { [key]: string },
  mapGettersToProps?: Array<string>,
) => (Component) => Component

registerModule

(
  namespace: string | Array<string>,
  module: Object,
)

Registers a provided module, only if it has not already been registered previously.

compose

(
  ...hocCreators: Array<Function>
) => (Component) => Component;