【HarmonyOS NEXT】父组件中定义的方法如何传递给子组件

 

【关键字】

父组件 / 方法 / 传递 / 子组件

【问题描述】

下图蓝色框为父组件，绿色框为子组件，点击“更多”时需要执行不同逻辑。

父组件中定义了点击事件执行的方法，如何通过参数传递给子组件执行？

【解决方案】

示例代码如下：

import { router } from '@kit.ArkUI'

@Entry
@Component
struct ParentPage {
build() {
Column() {
MyComponent({
disText: '我是子组件1', onClickEvent: (): void => {
router.pushUrl({ url: 'pages/Index' })
}
})
MyComponent({
disText: '我是子组件2', onClickEvent: (): void => {
router.pushUrl({ url: 'pages/ImagePage' })
}
})
}
.width('100%')
.height('100%')
}
}

@Component
struct MyComponent {
@State disText: string = ''
onClickEvent?: () => void

build() {
Column() {
Text(this.disText)
.fontSize(30)
.onClick(() => {
if (this.onClickEvent !== undefined) {
this.onClickEvent()
}
})
}
}
}