vue.js: Watched input not fired on every keypress

Question

I have an input whose model property is beeing watched. The problem is that the watch method is not called on every key press in Chrome Android devices. If I tap the input text, then it gets called. It did worked in the past and I don't know what happened. On Chrome Desktop it works (that is: the watch for text is beeing called on every keypress).

Input:

  <input id="input-message" ref="input-message" :disabled="disabled"
  @focus="$emit('focus')" @keyup.enter="sendMessage" 
  v-model="text" type="text" placeholder="Start typing..." 
  class="form-control">

Watch:

  watch: {
    disabled: function(val) {
      if (!val) {
        this.$nextTick(() => {
          this.$refs["input-message"].focus();
        });
      }
    },
    text: function(val) {
      var mode = this.micMode;
      if (this.userAgent !== "ios") {
        let isEmpty = val.length === 0;

        if (mode === 1 && !isEmpty) {
          this.micMode = 0;
        } else if (mode === 0 && isEmpty) {
          this.micMode = 1;
        }
      }

    }
  },

tony19 · Accepted Answer · 2022-07-15 02:40:27Z

8

For languages that require an IME (Chinese, Japanese, Korean etc.), you’ll notice that v-model doesn’t get updated during IME composition. If you want to cater for these updates as well, use input event instead.

https://v2.vuejs.org/v2/guide/forms.html#vmodel-ime-tip

you can change v-model="model" to :value="text" @input="text = $event.target.value" and the watcher should be triggered as expected

edited Jul 15, 2022 at 2:40

tony19

140k23 gold badges281 silver badges354 bronze badges

answered Apr 20, 2018 at 14:42

Jacob Goh

20.9k5 gold badges58 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

vue.js: Watched input not fired on every keypress

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related