一：父组件 向 子组件 传值

WXML 数据绑定

父组件：

father.wxml

<view>
  <my-component prop-a="{{dataFieldA}}" propB="{{dataFieldB}}"></my-component>
</view>

father.js

Page({
  data: {
    dataFieldA: '123',
    dataFieldB: '456'
  }
})

子组件:

my-component.wxml

<view>
  <view>propA: {{propA}}</view>
  <view>propB: {{propB}}</view>
</view>

my-component.js

Component({
  properties: {
    propA: String,
    propB: String
  }
})

二：子组件 向 父组件 传值

事件

子组件

my-component.wxml

<button bindtap="onTap">点击这个按钮将触发“myevent”事件</button>

my-component.js

Component({
  properties: {},
  methods: {
    onTap() {
      var myEventDetail = {} // detail对象，提供给事件监听函数
      var myEventOption = {} // 触发事件的选项
      this.triggerEvent('myevent', myEventDetail, myEventOption)
    }
  }
})

父组件：

father.wxml

<my-component bindmyevent="onMyEvent" />
<!-- 或者可以写成 -->
<my-component bind:myevent="onMyEvent" />

father.js

Page({
  onMyEvent: function(e){
    e.detail // 自定义组件触发事件时提供的detail对象
  }
})

三：父组件 获取 子组件 值

获取组件实例

子组件

my-component.wxml

Component({
 data: {
    name: 'my-component'
  }
})

父组件：

father.wxml

<my-component class="my-component"></my-component>
<button bindtap="getChildComponent">获取子组件实例</button>

father.js

Page({
  getChildComponent () {
    const child = this.selectComponent('.my-component');
    console.log('子组件实例为：', child.data);
  }
})