d父组件向子组件传值
首先在页面json文件中引入组件:
第二步在页面中使用组件并向组件中传入两个对象:
第三步 在子组件中接收传入的数据
Component({
/**
* 组件的属性列表
*/
properties: {
memberDetail: {
type: Object,
value: {}
},
userInfo: {
type: Object,
value: {}
},
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 监听传入的值改变
*/
observers: {
'userInfo': function (newUserInfo) {
if (newUserInfo) {
// 当监听到 userInfo有变化时执行
}
}
},
/**
* 组件的方法列表
*/
methods: {
}
})
如果想要在子组件properties中修改传入的值,还是直接用this.setData就可以。如果要修改传入对象的某个属性值,在属性上加个单引号就可以了。
this.setData({
'memberDetail.remark': e.detail.value
})
子组件向父组件传值
在子组件修改的值要想传给父组件,使用 this.triggerEvent和vue的$emit是一样的,例如:
// e.detail.value是我要给父组件传的值
this.triggerEvent('send', e.detail.value)
在父组件接收,只需要绑定send方法就可以
<users bindsend="send" memberDetail="{{memberDetail}}" userInfo="{{userInfo}}"></users>
当收到子组件传过来的send方法后 就可以在父组件中打印出传过来的值。
send(e){
console.log(e.detail,'父组件传过来的e')
},