Vue添加和删除属性

一、$set = >添加属性

<div id="itany">
    <button @click="doAdd">添加属性</button>
    <h2>{{user.age}}</h2>
</div>
var vm = new Vue({
    el: '#itany',
    data: {
        user: {
            id: 1,
            name: 'zhang'
        }
    },
    methods: {
        doAdd() {
            this.$set(this.user, 'age', 18); //通过vue实例的$set方法为对象添加属性，可以实时监视
            Vue.set(this.user, 'age', 22); // Vue.set(this.user,'age',22);全局方式也可以设置
            //if (this.user.age) {
            //  this.user.age++;
            //} else {
            //  Vue.set(this.user, 'age', 1);
            //}小判断，如果user对象存在age属性，就加一，否则添加属性age并赋值1
        },
    }
});

二、$delete = >删除属性

<button @click="doDelete">删除属性</button>
doDelete() {
    if (this.user.age) {
        Vue.delete(this.user, 'age'); //全局方式
    }
}