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})


  }
}

Logo

社区规范:仅讨论OpenHarmony相关问题。

更多推荐