Vue中重置data的数据为初始状态

例如data中的数据如下

data() {
	return {
		form: {
			name: '',
			sex: '',
			desc: ''
		}
	}
}

你想在某个方法中重置data中的form对象，一般这样操作

this.form.name = ' '
this.form.sex= ' '
this.form.desc= ' '

或者

this.form= {
	name: '',
	sex: '',
	desc: ''
}

如果form里的属性有很多呢，这样操作是不是非常的麻烦，看上去也不美观呀，那你可以使用下面的方法，一行代码搞定

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

所以，下面就可以将初始状态的data复制到当前状态的data，实现重置效果：

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

当然，如果你只想重置data中的某一个对象或者属性：

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

也可以通过给组件 $data 对象赋值来重置来重置整个 $data

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

结语

vue组件可以通过 this.$options 对象获取你编写的任何方法，比如 created( ) 生命周期函数，发现vue新玩法