重置数据this.$options.data()

本文介绍了一种在Vue中通过`Object.assign`和`$options.data()`快速重置数据的方法,让你轻松还原初始状态,避免逐个属性恢复。重点讲解了如何使用和`formInline`属性的实例化与恢复过程。
摘要由CSDN通过智能技术生成

看别人的代码学到了这一个骚操作:

 // 重置数据
    resetData () {
      Object.assign(this.$data, this.$options.data())
    },


这一句功能很强大,相当于一旦调用这个方法,你当前页面的data中的属性值都会恢复到原始值,无论你对这个data中的属性做了啥子操作

//初始化的数据
data() {
    return {
      formInline: {
        status: '',
        result: '',
      },
      status: null,
      isShow: false,
    }
  },

//恢复到这个样子
data() {
    return {
      formInline: {
        status: '',
        result: '',
      },
      status: null,
      isShow: false,
    }
  },

如果想恢复个别值,比如formInline

this.formInline =  this.$options.data.call(this).formInline

那么其他的值改变了就是改变了,这个formInline值一旦改变了,然后执行上面那一句,立马恢复初始值,这样一来,我们就不用去这样恢复了:

this.formInline.status = ''
this.formInline.result = ''

如果想弄明白this.$options.data(),可以看看以下文章:

https://blog.csdn.net/mocoe/article/details/89682022

评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值