木灵鱼儿

木灵鱼儿

阅读:209

最后更新:2021/07/02/ 11:25:32

vue骚操作之重置data对象

简单说下使用场景,你使用一个dialog组件,弹窗时要加载数据,关闭后要清理数据,以防下次使用报错或者数据残留,如果在data中写了过多的属性,或者层级很深的引用对象啥的,为了方便还原,你可能会一个个的写。

onClose() {
  this.xxx = xxx;
  this.xxx.xxx = xxx;
  this.xxx.xxx = xxx;
  this.xxx.xxx = xxx;
}

对多个值进行赋值操作。

但是,这样实在是太难了,有没有一种简单的方法,就像表单重置一样。

答案当然是有的:

onClose() {
  Object.assign(this.$data, this.$options.data());
}

使用该方法,可以将data里的所有数据重置为默认初始值。

this.$data获取的是当前data对象

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

如果想还原某一个指定属性,可以单独设置

onClose() {
  this.xxx = this.$options.data().xxx;
}

版权申明

本文系作者 @木灵鱼儿 原创发布在木灵鱼儿 - 有梦就能远航站点。未经许可,禁止转载。

关于作者

站点职位 博主
获得点赞 0
文章被阅读 209

相关文章

目录树