Vue.js and JS Binding : Getting length-1 in js when I use v-model binding with Vue.js

Question

Here Vue.js code

<md-input-container>
  <label>Proxy</label>
  <md-input type="text" name="proxy" v-model="proxy"  v-on:change="checkProxy"></md-input>
</md-input-container>

Here a Js Code when I get the proxy length I get the length -1 eg: I enter 12345 I get the length 4

data: function(){
    return {proxy:''},
},

checkProxyId:function(){
            console.log("Length:",this.proxy.length);
},

But if I try keyup in Vue.js

@keyup.native="check"

then the result will be same eg 123456 length = 6

Any idea why this happens ?

Answer 1

Try this:

    <input type="text" name="proxy" v-model="proxy">

    data() {
      return {
        proxy: ''
      };
    },
    watch: {
      proxy(value) {
        console.log(value.length);
      }
    }