目录
一、 父子组件间通信的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()
}