小程序篇—父组件与子组件之间的传值
1、父组件传递给子组件值，首先在components 中新建一个testComponents子组件，代码如下：
testComponents.wxml
<view>
<text>{{value}}</text>
</view>
testComponents.js
Component({
/**
* 组件的属性列表
*/
properties: {
value:{
type:String, //指定传过来的值的类型
value:0 //默认值，假如没有值传过来，value就会显示默认值
}
},
})
2、接下来我们新建一个index父组件，对应代码如下：
index.json
{
"usingComponents": {
"testComponent":"../../components/testComponent/testComponent" //子组件的路劲
}
}
index.wxml
<view > <testComponent value="张三"></testComponent> </view>
3、运行index父组件得到的效果图如下（假如value值没传，那么内容就会显示为默认值：0）：
4、子组件传递给父组件值，还是用上面的子组件，代码如下：
testComponent.wxml
<view> <button bindtap="testClick">点击传递给父组件值</button> </view>
testComponent.js
Component({
/**
* 组件的方法列表
*/
methods: {
testClick(){
//triggerEvent可以理解为vue中$emit
this.triggerEvent("myevent","张三")
}
}
})
5、还是用上面的父组件，代码如下：
index.json
{
"usingComponents": {
"testComponent":"../../components/testComponent/testComponent"
}
}
index.js
Page({
data:{
value:null
},
thismyevent(e){
// e.detail = 子组件传递过来的值
this.setData({
value:e.detail
})
}
})
index.wxml
<view >
<testComponent bindmyevent="thismyevent"></testComponent>
<text>{{value}}</text>
</view>
6、点击按钮得到子组件传递过来的张三，运行代码得到的效果图如下：
小程序篇---父组件与子组件之间的传值
原文：https://www.cnblogs.com/laid/p/14664641.html