欢迎光临
我们一直在努力

Vue怎么清空对象

本篇内容介绍了“Vue怎么清空对象”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

Vue清空对象

JS清空对象

使用字面量方法指向一个新的对象:

var obj = {
    name: 'Lee',
    age: 20
};
obj = {};
var obj = {
    name: 'Lee',
    age: 20
};
for(var key in obj){
    delete obj[key];
}

Vue清空对象

使用对象字面量,不推荐使用。

<div id="app">
    <button @click="deleteInfo">删除</button>
    姓名:{{ message.name }},
    年龄:{{ message.age }}
</div>
var app = new Vue({
    el: '#app',
    data: {
        message:{
            name:"Lee",
            age: 20
        }
    },
    methods:{
        deleteInfo:function(){
               this.message = {};
        }
    }
})

使用 Vue.delete:

<div id="app">
    <button @click="deleteInfo">删除</button>
    姓名:{{ message.name }},
    年龄:{{ message.age }}
</div>
var app = new Vue({
    el: '#app',
    data: {
        message:{
            name:"Lee",
            age: 20
        }
    },
    methods:{
        deleteInfo:function(){
            for(let key of Object.keys(this.message)){
                Vue.delete(this.message,key);
            }
        }
    }
})

某一个对象清空vule值,保留key

其中就是将一个对象的属性copy到另一个对象

在vue中

  • this.$data 获取当前状态下的data

  • this.$options.data() 获取该组件初始状态下的data

所以,下面就可以将初始状态的data复制到当前状态的data

实现重置效果:

Object.assign(this.$data, this.$options.data())

当然,如果你只想重置data中的某一个对象或者属性:(一般用于表单清空数据)

this.form = this.$options.data().form

某一个对象清空vule值,保留key

Object.keys(form).forEach((key) => (form[key] = ''))

“Vue怎么清空对象”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注云搜网网站,小编将为大家输出更多高质量的实用文章!

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。