鸿蒙父组件处理子组件的点击事件
·
1.导入子组件和事件处理器
import { PageHeader } from '../../../components/Header';//路径根据实际情况选择
import { emitter } from '@kit.BasicServicesKit';
2.页面生命周期注册事件回调
aboutToAppear(): void {
// click 定义可以自己 随便定义保持跟子组件的一致即可
emitter.on("click",()=>{
//写上自己的处理逻辑
console.log('click is ok !')
})
}
3.build函数部分使用子组件
build() {
Column() {
//使用子组件
PageHeader({ title:'通讯录' })
}
.height('100%')
.width('100%')
}
4.子组件部分
import { emitter } from '@kit.BasicServicesKit';
@Component
export struct PageHeader{
@State showBack:boolean = false
@Prop title:string = "首页"
@Prop right:string = "..."
build() {
Row(){
Text(this.showBack?"返回":'')
.fontSize(20)
.onClick(()=>{
let router = this.getUIContext().getRouter()
router.back()
})
Text(this.title)
.fontSize(20)
Text(this.right)
.fontSize(20)
.onClick(()=>{
// 关键性代码 发送事件给父组件
emitter.emit("click" )
})
}.justifyContent(FlexAlign.SpaceBetween)
.width('100%')
.padding({left:10,right:10})
}
}
更多推荐
所有评论(0)