Skip to content Skip to sidebar Skip to footer

V-model On Input That Dynamically Changes Value By Other Script ?

I have two input that store lat and lng from google map script, if the user changes the marker's position => these two inputs get the lat and lng that the user pecked, so I wann

Solution 1:

To trigger Vue.js to read your input's value after it changes dynamically from an external script, you have to call:

document.querySelector('#element-id').dispatchEvent(newEvent('input'))

on your element. This works on both <input> and <textarea> elements. For <select> elements you would have to call:

document.querySelector('#element-id').dispatchEvent(newEvent('change'))

Solution 2:

You need to watch your two variables, and assign the value to the new one.

Solution 3:

Watch your variables using watch properties:

HTML:

<divid="el"><form><inputv-model="foo"><inputv-model="bar"></form><p>{{ foo }}</p><p>{{ bar }}</p></div>

JS:

newVue({
   el: "#el",
   data: {
       foo: '',
       bar: ''
   },
   watch: {
      foo: function(value) {
         this.foo = value
       },
      bar: function(value) {
         this.bar = value
      }
   }
});

Post a Comment for "V-model On Input That Dynamically Changes Value By Other Script ?"