v-model+watch实现输入监听（自动区分输入法）

监听输入事件时，你一定遇到过这样的情况：

在中文状态下向输入框中输入‘地球’二字，在我们按 ‘空格’前，拼音‘diqiu'在按每个字母时都会触发代码执行一次，若处理中存在ajax请求就会出现多次调用的情况。这显然不是我们想要的，我们想要的仅仅是当’地球‘二字输入的时候才会触发代码执行，这难么，难么，难么~~~

其实不难，使用Vue的v-model指令和watch监听，就可以轻松实现，哈哈哈哈，继续吧

直接干货，上菜

<div id="app">

    <input v-model="msg" >

</div>

nev Vue({

    el: '#app',

    data: {

        msg:  ''

    },

    watch: {

        msg(newvalue, oldvalue) {

            console.log(newvalue, oldvalue)
            // 还可以做很多操作哦

         }

    }

})

快动手试试吧。。。

优点总结：

1、对于使用输入法（如中文、日文等）的语言，不会在输入法组合文字过程中更新

2、不用给元素另外绑定监听事件