子组件监听props对象和Object.assign用法

父组件中:
<child :value="parentform"></child>

data () {
return {
parentform: {
a: '1'
}
}
},

子组件中:
props: {
value: {
default:{},
required: false,
type: Object,
},
}
data () {
return {
form: {
a: '1',
b:'2'
}
}
},
//子组件载入前合并一次
mounted(){
Object.assign( this.form,this.value)
},

//父组件value值发生变化时子组件监听到合并一次
watch: {
value:{
handler(newVal, oldVal) {
console.log(newVal);
Object.assign( this.form,this.value)
},
immediate: true,
deep: true,
},
},

Object.assign用法:
const target = { a: 1 };
const source1 = { b: 2 };
const source2 = { c: 3 };
Object.assign(target, source1, source2);
Object.assign方法的第一个参数是目标对象,后面的参数都是源对象。

注意,如果目标对象与源对象有同名属性,或多个源对象有同名属性,则后面的属性会覆盖前面的属性。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容