vuex-compose

Connect components through HOCs

Downloads in past

Stats

StarsIssuesVersionUpdatedCreatedSize
vuex-compose
25971.2.05 years ago6 years agoMinified + gzip package size for vuex-compose in KB

Readme

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;