computed和watch的用法和區別

computed可以監聽v-model（data）中的值，只要值發生變化 他就會重新去計算 computed必須是要有一個返回值的哦 

  <div id="app">
        <input type="text" v-model="firstname">+
        <input type="text" v-model="lasttname">=
        <input type="text" v-model="fullname">
    </div>

var vm = new Vue({ el: "#app", data: { firstname: "", lasttname: "", }, methods: { }, // computed可以監聽v-model（data）中的值，只要值發生變化 他就會重新去計算
             // computed必須是要有一個返回值的哦 
 computed: { fullname: function () { return this.firstname + "-" + this.lasttname } }, })

 

//watch除了可以監聽data中值的變化，還可以監聽路由的變化，
//watch中有兩個參數 分別是新值和舊值

     var vm = new Vue({
            el: "#app",
            data: {

            },
            methods: {

            },
            router: router,
            watch: {
                "$route.path":function(newval,oldval){
                if(newval==="/login"){
                    console.log("這是denglu頁面")
                }else if(newval==="/zhuce"){
                    console.log("這是注冊頁面")

                }
                }
            },

        })

 

computed和watch的區別
《1》計算屬性computed 必須要返回一個值哦 通過return來返回的

《2》 watch的回調函數里面有兩個參數，分別是newval和oldval。