computed计算属性

computed计算属性的三个特点

1.计算属性使用时当作普通属性使用，不能加()当方法使用

2.计算属性的function内部，任何data发生改变，这个计算属性就会重新计算

3.计算属性的结果会被暂时缓存，方便下次使用

<input type="text" placeholder="姓名" v-model='fullname'>

------------------------------------------------------------------------ 

var vm = new Vue({
    el:"#app",
    data:{
        firstname:'',
        lastname:'',
    },
    computed:{  
        //在computed中可以定义一些计算属性， 注意使用时直接当做 属性 来使用，不当做方法！！
        'fullname':function(){
             return this.firstname+'-'+this.lastname
        }
    }
})

计算属性的set方法

<input type="text" placeholder="姓名" v-model='myName' @input="changeNanme">

------------------------------------------------------------------------ 

var vm = new Vue({
    el:"#app",
    data:{
        name:'Tom',
    },
    methods:{
        changeNanme(e){
            const value = e.target.value;
            this.myName = value;
        }
    },
    computed:{  
       myName:{
           set:function(newVal){
                this.name = newVal;
           },
           get:function(){
                return this.name
           }
       }
    }
})