当前位置:   article > 正文

鸿蒙开发之组件间方法传递(方法回调)_鸿蒙开发方法回调

鸿蒙开发方法回调

目前使用的方式有两种,一种是父子组件方法传递,一种是系统提供的emitter。

一、父子组件方法传递

1.1 使用场景

当我们父组件中有一个方法,需要子组件在修改完数据后回调父组件的方法时候。有点抽象:这样解释一下,父组件A中创建了子组件B,A中一个方法是需要B端更新数据后调用来刷新页面。这样我们就需要将A中的方法传递给子组件B。然后,B端改完数据后调用这个方法。

1.2 伪代码实现
  1. //父组件A中的伪代码
  2. //A组件中的方法实现
  3. startCalcuteMoney() {
  4. //。。。。这里进行方法处理
  5. }
  6. build() {
  7. Column() {
  8. ListItem() {
  9. TopCellItem({startCalcute:this.startCalcuteMoney.bind(this)})
  10. }
  11. }
  12. }
  13. //=========================================//
  14. //子组件B中的伪代码
  15. @Component
  16. struct TopCellItem {
  17. //接受父类传递的方法
  18. startCalcute:() => void
  19. build() {
  20. Column(){
  21. Text('点击调用父组件方法')
  22. .fontSize(20)
  23. .onClick(() => {
  24. this.startCalcute()
  25. })
  26. }
  27. }

比较好理解,不过需要注意的是父组件在传递给子组件方法的时候需要bind(this)。

当B组件TopCellItem点击Text的时候就可以回调父组件的方法了。

二、emitter

可以先看一下官方文档,解释的比较清晰。

2.1 使用场景

这个对于原生iOS开发来说就像notification通知,或者swift的EventBus。可以实现跨页面,跨组件的一对多的传递。例如主题设置,我在设置完主题颜色的时候,需要所有监听到的地方发生更改。这就需要用到emitter了。

2.2 伪代码实现
  1. //发送信号的方法
  2. saveportfoilRate() {
  3. //发送信号
  4. let eventData = {
  5. data: { //发送的数据
  6. "rate": this.portfolioRate,
  7. }};
  8. let innerEvent = {
  9. eventId: 11, //发送的ID,需要跟监听方一致
  10. priority: emitter.EventPriority.HIGH
  11. };
  12. emitter.emit(innerEvent, eventData);
  13. }
  14. //=====================================================
  15. //监听信号的地方
  16. listenRateChange() {
  17. let innerEvent = {
  18. eventId: 11 //监听的ID,需要跟发送方一致
  19. };
  20. function EmitterCallback(eventData) {
  21. //处理收到的数据
  22. }
  23. emitter.on(innerEvent, EmitterCallback.bind(this));
  24. }

同样需要注意的是,在监听信号的地方需要bind(this)。

当组件A中调用发送信号的地方时候,组件B在监听的地方就可以收到了。需要注意的是需要先监听再发送。

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/盐析白兔/article/detail/330982
推荐阅读
相关标签
  

闽ICP备14008679号