mpvue的自定義元件中執行$emit函式時輸入框游標抖動的解決辦法

messchow發表於2019-02-16

記錄一個mpvue中遇到的問題

遇到問題

//css
 <input type="number" v-model="value" @input="getValue">

//vue 
export default {
 data() {
      return {
        value: ``
      }
    },
 methods:{
     getValue() {
        this.$emit(`value`, this.value);
      }
 }
}

在getValue中執行emit時輸入框的游標抖動。游標閃爍這個問題一般可以用官網推薦的方法v-model.lazy修飾符解決,但是在此情況嘗試無效。

解決辦法

於是我用想象力,沒錯是想象力T_T|||。我想游標頻繁閃爍是不是value被頻繁操作,於是嘗試斷開emit和v-model的耦合關係,問題竟然真解決了…也是醉啊…

...
getValue() {
 var val = this.value;
 setTimeout(() => {
    this.$emit(`value`, val);
 }, 0)
},
...

相關文章