Search code examples
javascriptvue.jsvuex

Is it agains the convention to use `Vue.nextTick` in the Vuex mutation? May it break something?


As far as I know a mutation in Vuex should be synchronous. Vuex.nextTick ends up being asynchronous if I understand it correctly. Does it make it agains the convention to use it in the mutation then? Could it break something? I have tried doing it this way and it seemed to work fine, but I haven't tried going back to previous state with Dev Tools for example.

Just to let You know: I use nextTick to postpone some sorting to avoid doing it unnecessarily multiple times. Maybe You have some other solution to that issue? I know I could use an action istead of a mutation, but I wanted to change some actions I already have into mutations as it seems to be a better option for me, but they use this piece of code.


Solution

  • Using nextTick in a mutation effectively moves the code outside the mutation, so you'll get errors in strict mode and the Devtools can't track the changes.

    Also, nextTick won't run until after the next round of rendering, so you're going to be rendering multiple times.

    If possible use a getter for the sorted list instead.