自定义组件间通信-2

目录

一、 父子组件间通信的3种方式

二、属性绑定，父-> 子

 三、事件绑定，子-> 父

四、获取组件实例

---

一、 父子组件间通信的3种方式

• 属性绑定：用于父组件向子组件的指定属性设置设置数据，仅能设置JSON兼容的数据
• 事件绑定：用于子组件向父组件传递数据，可以传递任意数据
• 获取组件实例：父组件可以通过this.selectComponent() 获取子组件实例对象,这样就可以直接访问子组件的任意数据和方法

二、属性绑定，父-> 子

子组件在properties节点中声明对应的属性并使用。

 三、事件绑定，子-> 父

事件绑定用于实现子向父传值，可以传递任何类型数据。使用步骤如下：

在父组件的js文件中，定义一个函数，这个函数即将通过自定义事件的形式，传递给子组件

  /**
   * 组件的方法列表
   */
  methods: {

    customMethod: function () {
      // 这里使用triggerEvent返回名称为myevent的事件，并携带一个参数
      this.triggerEvent('myevent',true)
    }
  }

 在父组件中的使用

<view>
<Test5 bind:myevent="handleMyevent"></Test5>
</view>

四、获取组件实例

在父组件js中如下处理：

getChild() {
    const child = this.selectComponent('Test5')
    child.setData({count: child.properties.count + 1})
    child.countAdd()
  }