监视文本框的输入

watch属性

<div id="app">
        <input type="text" v-model="fir">+
        <input type="text" v-model="sec">=
        <input type="text" v-model="full">
    </div>
    <script>
        var vm=new Vue({
            el:"#app",
            data:{
                fir:'',
                sec:'',
                full:''
            },
            methods:{},
            watch:{
                fir:function(){//fir可以加引号也可不加，如果是fir-name这样的形式就要引号
                    this.full=this.fir+this.sec
                },
                sec:function(){
                    this.full=this.fir+this.sec
                }
            }
        })
    </script>

watch里面就实现了对两个文本框的监视

keyup事件监听

 

监听路由变化

 watch:{
     '$route.path':function(newval,oldval){
                     console.log(newval+'---'+oldval)
                   }
       }

 

computed计算属性值

            computed:{
                'full':function(){
                    return this.fir+this.sec
                }
            }

这样就不用在data中设置我们的属性，可以直接用“full”这个属性：

<input type="text" v-model="full">

并且我们这个属性值当第一次被用到的时候就会被调用并且缓存起来，所以computed里面的函数只调用一次