Vue-计算属性

计算属性

　　把computed中的方法当做属性使用,会返回一个数据供使用

<div id="app">
            <p>{{msg}}</p>
            <p>方法获取的年龄:{{getAge()}}</p>
            <p>计算属性获取的年龄:{{getAge_computed}}</p>
            <button @click="change">改变birth的值看看年龄变不变</button>
        </div>
new Vue({
                el: "#app",
                data: {
                    msg: "hello",
                    birth: "1995-02-03"
                },
                methods: {
                    getAge() {
                        var age = new Date().getFullYear() - new Date(this.birth).getFullYear()
                        return age + "岁"
                    },
                    change() {
                        this.birth = "1996-02-03"
                    }
                },
                computed:{
                   //计算属性第一种用法
                    getAge_computed(){
                        var age = new Date().getFullYear() - new Date(this.birth).getFullYear()
                        return age + "岁"
                    }
                    //计算属性第二种用法
                    xx:{
                        set(oldvalue){},
                        get(){}
                    }
                }
            })