微信小程序父传子，子传父组件通信示例

父传子：

父：

在父文件夹下的.json文件下引入子组件
代码：

{"usingComponents": {"goods": "/component/goods/goods" 
/*这是定义的组件名字*/   /*这是我子组件的路径*/}
}

然后在父组件里 以标签的形式写入子组件，传值的话在标签上自定义属性名，属性值要以双花括号保住

<goods list='{{list}}'>goods>

子：

在Component的properties中接收父组件传过来的数据

Component({ properties: {list: {            // 属性名type: Object,     // 类型（必填），目前接受的类型包括：String, Number, Boolean, Object, Array, null（表示任意类型）value: '标题'     // 属性初始值（可选），如果未指定则会根据类型选择一个}}
})

这样子组件就能接受的父组件传过来的值了在子组件的wxml中用双花括号引用就ok了

 <view>{{list.title}}view>     

子传父：

子传父运用了triggerEvent()

子：

方法中调用

 this.triggerEvent("change",res)  //第一个是自定义事件名，第二个是要传递的值（可以为空）

父：

然后在父组件中的子组件标签中绑定自定义事件

    <goods id='goods' list='{{list}}' bind:change="onChange">goods>

父组件或父页面内获取

    onChange(e) { //e为子组件传过来的值console.log(e.detail)this.setData({list: e.detail//这里是改变Page中data上的值})}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！