Vuex: Return value in actions

Created on 25 Jan 2016  Â·  9Comments  Â·  Source: vuejs/vuex

I tried to return some value in actions. But i found out that the value received in components is always undefined. (For some reason I don't want to use states here.) Is it a bug?

Most helpful comment

You should not care about the return value of actions. They should be fire and forget. Maybe it's better to explain your reason why you don't want to state. If you don't want to use state then why use Vuex?

All 9 comments

You should not care about the return value of actions. They should be fire and forget. Maybe it's better to explain your reason why you don't want to state. If you don't want to use state then why use Vuex?

Sorry, I didn't explain myself clearly. I am using state for the project, but for this one particular action, I try to do some operations on the state and local storage, and then return success: true / false. I just think that it will be more convenient if actions can return value.

So what do you plan to do when you get the success result? If you are applying more side effects, then the success/failure should both be explicit mutations and be dispatched inside that action you just called.

An example: when we call the checkout action, we don't expect a return value or give it a callback to know whether it succeeds - instead, it will dispatch corresponding mutations.

Okay. I think I didn't follow the data flow of vuex very well. I just need to improve my coding. Thanks a lot, 尤大大.

Is there possibility to return Promises from Actions or Mutations?

@CodeLookBook Yes, but even better, you can use async/await: https://vuex.vuejs.org/en/actions.html#composing-actions

I think that returning values from actions can actually be useful in some cases. In my application there are global modals that are controlled via VueX store. An action is fired to open a modal, and I wanted to return some kind of modal ID from action. This ID could be later used as a "handle" to control this modal, query its state, etc. Also, this will allow to implement wait-for-close behavior without storing onClose callbacks in store.

I think that returning values from actions can actually be useful in some cases. In my application there are global modals that are controlled via VueX store. An action is fired to open a modal, and I wanted to return some kind of modal ID from action. This ID could be later used as a "handle" to control this modal, query its state, etc. Also, this will allow to implement wait-for-close behavior without storing onClose callbacks in store.

You can store handles in Vuex, maybe in a lookup table fashion, and subscribe to mutations for your wait-for-close?

So what do you plan to do when you get the success result? If you are applying more side effects, then the success/failure should both be explicit mutations and be dispatched inside that action you just called.

An example: when we call the checkout action, we don't expect a return value or give it a callback to know whether it succeeds - instead, it will dispatch corresponding mutations.

take is use case , where the submit cart action creates an order through a rest service which generates the unique order id. the response from the backend service can be added to the state through the mutation , however how will the component get the order id (yes getter can be used but what if the order is an Array and it contains the previously created orders , the getter should be a lookup by order id , but to use the getter the component method needs to get the order id reference after dispatching the action to the store) whats the best practice here ?

Was this page helpful?
0 / 5 - 0 ratings