Search code examples
vuejs2vuex

Vue / Vuex : paste event triggered before input binded value is updated


I have a simple form in a component :

<form v-on:submit.prevent="submitSearch">
    <input v-model="objId" @paste="submitSearch">
    <button>Submit</button>
</form>

and

var searchForm = {
    methods :   {
        submitSearch() { 
            store.dispatch('submitSearch')
        }
    },
    computed : {
      objId: {
        get () {
          return ...
        },
        set (id) {
          store.commit('objId', id)
        }
      }
    },
    ...
};

It works well when typing and submitting, however when pasting a value submitSearch is called just before objId is updated so it doesn't. Is there a consise and vue-friendly way to handle this?


Solution

  • Solved it using nextTick() :

    submitSearch() { 
        Vue.nextTick().then(function () {
            store.dispatch('submitSearch')
        })
    }
    

    Not sure if it's the recommended way but it works well and avoid extra variables.