Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: allow to passing functions in mapActions/mapMutations (fix #750) #924

Merged
merged 2 commits into from
Aug 31, 2017

Conversation

ktsn
Copy link
Member

@ktsn ktsn commented Aug 30, 2017

This is a small improvement for mapActions and mapMutations helpers. It allows users to pass functions in the helpers so that reducing some redundant method definitions. The feature is like a counterpart of passing function in mapState.

For example:

const vm = new Vue({
  store,
  template: `<input @input="onInput">`
  methods: mapActions({
    onInput (dispatch, event) {
      // First argument is as same as this.$store.dispatch
      dispatch('inputText', {
        text: event.value
      })
    }
  })
})

The above code is equivalent with the below (Note that inputText is a bit redundant since it is just an bridge method between onInput and the action):

const vm = new Vue({
  store,
  template: `<input @input="onInput">`
  methods: {
    ...mapActions(['inputText']),
    onInput (event) {
      this.inputText({
        text: event.value
      })
    }
  })
})

In addition, this syntax is more effective when we map namespaced modules.

methods: mapActions('some/module', {
  onInput (dispatch, event) {
    // `dispatch` is already namespaced here.
    // So the below line will call `some/module/inputText` action.
    dispatch('inputText', {
      text: event.value
    })
  }
})

I did not implement this syntax for mapGetters because we already can do the same thing with mapState.

Close #750

@ktsn ktsn requested a review from yyx990803 August 30, 2017 15:20
@ktsn ktsn changed the title feat: allow to passing functions in mapActions/mapMutations feat: allow to passing functions in mapActions/mapMutations (fix #750) Aug 30, 2017
@rayax86
Copy link

rayax86 commented Mar 19, 2018

Hi @ktsn, could you please elaborate on

I did not implement this syntax for mapGetters because we already can do the same thing with mapState.

?

What do you mean by "we already can do the same thing with mapState"?

A little bit of context: I am in a situation where I wish to dynamically map getters to one computed property, depending on a piece of data. So it would be nice to:

...mapGetter({
    someValue: function(getters) {
        return getters[this.getterName]
    }
}

@rayax86
Copy link

rayax86 commented Mar 21, 2018

Nevermind, I now see getters are passed to mapState as a param.

Would be nice if the documentation mentions this though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants