微信小程序组件传值

一、父传子:通过属性传值

<1>在父组件传值的地方添加一个自定义的属性,例如:expo=“{{aaa}}”,如果值是变量加{{}},如果不是,则去掉{{}}。

父组件的wxml文件:
父组件自定义属性
父组件的js文件中,属性值为要传递的数据:
此处为获取的后台数据

<2>子组件(在小程序中为自定义组件)则在js文件中的Component中添加properties,在properties中接受父组件的值,并定义为一个对象,设置这个对象的类型。

子组件(自定义组件)的js文件:
设置数据类型
<3>最后在子组件的wxml中直接{{}}调用该对象:
因为是数组数据,所以要循环

二、子组件向父组件传值:事件绑定

<1>在子组件中绑定点击事件,通过triggerEvent方法传递子组件参数。

子组件的wxml文件:绑定事件
点击事件
子组件的js文件:triggerEvent方法
子组件参数
<2>在父组件中通过bind绑定事件,在js文件中通过this.setData接受参数,在wxml中显示{{}}参数内容

父组件wxml文件:bind绑定事件
在这里插入图片描述

父组件js文件:this.setData
在这里插入图片描述