Vue computed 和 watch

 计算属性 简化插值表达式
               可以将计算过程保存到计算属性中
 
         {{reverseStr}}
         {{reverseStrA()}}

methods:{
// 计算方法
    reverseStrA(){
        console.log("我是计算方法的调用");
            return this.msg.split('').reverse().join('')
}
},

定义计算属性 与方法的区别
 1.计算属性有缓存的操作，只执行一次，效率更高
2.计算属性调用时只需要写属性名称
3.每次调用方法时都会执行，没有缓存操作
4.调用方法时需要();
computed:{
// 必须有返回值
reverseStr(){
console.log("计算属性");
    return this.msg.split('').reverse().join('')
        }
    }

// 定义监听器 自动调用
                watch:{
                    // 当数据发生变化时，就会触发监听器的函数，必须传递参数到监听器中
                    firstName(value){
                        // console.log(value);
                        this.fullName  = value +this.lastName 
                    },
                    lastName(value){
                        this.fullName = this.firstName  + value
                    }
                },