美文网首页
vue 侦听器watch

vue 侦听器watch

作者: Gino_Li | 来源:发表于2019-04-15 00:01 被阅读0次

    watch 侦听data中的变量发生变化时,其变化前后的值

    <div id="app">
        <input type="text" v-model="firstName" />
    </div>
            
    var vm = new Vue({
        el:"#app",
        data:{
            firstName:"张",
            lastName:"食盐",
            timer:0
        },
        watch:{
            firstName(newVal,oldVal){
                //firstName即为你想监听的数据的名称
                //newVal:表示改变后的值
                //oldVal:表示改变前的值
                clearTimeout(this.timer);
                //节流,在输入1.5s后在打印内容
                this.timer=setTimeout(()=>{
                    console.log({newVal,oldVal})//{newVal: "陈", oldVal: "张"}
                },1500)
            }
        }
    })
    

    相关文章

      网友评论

          本文标题:vue 侦听器watch

          本文链接:https://www.haomeiwen.com/subject/mvaewqtx.html