Vue / Vuex : 입력 바인딩된 값이 업데이트되기 전에 트리거된 붙여넣기 이벤트

Vue / Vuex : 입력 바인딩된 값이 업데이트되기 전에 트리거된 붙여넣기 이벤트

컴포넌트에 간단한 형식이 있습니다.

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

그리고.

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

입력 및 제출 시에는 잘 작동하지만 값을 붙여넣을 때는 잘 작동합니다.submitSearch직전에 호출됩니다.objId갱신되어 있지 않습니다.이 문제를 해결하기 위한 합의와 친근한 방법이 있습니까?

한 가지 방법은 로컬 변수를 갖는 것입니다.isPaste로 설정합니다.true의 경우,paste이벤트가 트리거됩니다.그리고 등록도 합니다.input다음에 트리거되는 이벤트paste이벤트 및 확인isPaste이true이 경우 전송하고 설정합니다.isPaste로.false다시.

<input v-model="objId" @paste="paste" @input="input">


data(): {
  return {
    isPaste: false
  }
},
methods: {
  paste() {
    this.isPaste = true;
  },
  input() {
    if (this.isPaste) {
      store.dispatch('submitSearch');
      isPaste = false;
    }
  }
}

다음 방법으로 해결nextTick():

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

권장되는 방법인지는 잘 모르겠지만 잘 작동하며 추가 변수를 피합니다.

언급URL : https://stackoverflow.com/questions/48368799/vue-vuex-paste-event-triggered-before-input-binded-value-is-updated