1.場所描述
如何獲取vue-data中的所有值?
如何獲取vue-data中的某一個值?
如何獲取vue-data中的初始值?
如何設置data中的值位初始值?
2.主角登場 this.$options.data()和this.$data
<template>
<div>
<button @click="gotos">改變</button>
<button @click="obtain">獲取改變后的值</button>
<button @click="inithander">獲取初始狀態下的值</button>
<button @click="reset">重置</button>
</div>
</template>
<script>
export default {
data(){
return{
// https://www.jianshu.com/p/05697682a46f
obj:{
name:'張三',
age:'李四',
sex:'男'
},
subjective:{
info:'ok'
}
}
},
methods:{
gotos(){
this.obj.sex='我改變了性別'
},
//獲取vue中data中的所有值 當然data中的值也有可能是被改變了的
obtain(){
console.log('vue中data中的所有值',this.$data);
},
// 獲取組件下初始狀態下的值;就是你在data中最初寫的值
inithander(){
console.log('初始狀態下的值',this.$options.data());
},
// 重置值
reset(){
Object.assign(this.$data.obj,{name:'',age:'', sex:''});
// 還可以使用 Object.assign(this.$data.obj,this.$options.data().obj); //前提是obj的值是空
console.log('重置', this.obj )
}
}
}
</script>
