绚烂夏花之技 3 —— 自定义组件的守护与绽放 原创

夏花如梦
发布于 2024-11-14 12:14
浏览
0收藏

在HarmonyOS的ArkUI世界里,自定义组件如同夏日花园中争奇斗艳的花朵,而访问限定符则如同园丁精心布置的栅栏,守护着每一朵花的私密与安全。今天,就让我们漫步在这片繁花似锦的花园中,探讨这些园丁——访问限定符private、public和protected——是如何呵护我们的代码花朵的。

花园的守护者:访问限定符

在ArkUI的多彩世界中,自定义组件的成员变量可以被赋予private、public或protected的身份,如同花朵的保护色,它们不仅定义了变量的可见范围,还确保了代码的安全性和封装性。从API version 12起,ArkUI对这些访问限定符的使用进行了严格的规范,如同园丁对花朵的精心照料,防止了潜在的病虫害。

私密花房:Private限定符

当我们将一个变量标记为private时,就如同将花朵置于一个私密的花房中,它只能在这个组件内部被欣赏和照料。这样的变量不能在组件外部被窥探或触碰,这有助于我们保持组件的内部状态不被外界干扰。

@Component
struct PrivateFlowerComponent {
  @State private secretBloom: string = "Initial Bloom";

  build() {
    Column() {
      Text(this.secretBloom)
        .fontSize(16)
        .onClick(() => this.secretBloom = "Blooming Gorgeous");
    }
  }
}

在这个例子中,secretBloom变量是private的,它只能在PrivateFlowerComponent内部被欣赏和照料。任何试图从组件外部窥探secretBloom的行为都会导致编译的警告,如同试图进入一个上锁的花房。

花园的开放日:Public限定符

与private相反,public限定符如同花园的开放日,允许任何外部的访客欣赏和触碰花朵。但是,我们需要非常小心,因为这可能会破坏花朵的自然生长,使得花朵的内部状态容易被外界意外改变。

@Component
struct PublicGardenComponent {
  @State public sharedBloom: string = "Initial Bloom";

  build() {
    Column() {
      Text(this.sharedBloom)
        .fontSize(16)
        .onClick(() => this.sharedBloom = "Blooming Gorgeous");
    }
  }
}

在这个例子中,sharedBloom变量是public的,它可以在组件外部被欣赏和触碰。但是,这种开放性可能会带来问题,如同在花园开放日不小心折断了花枝。

半开放的温室:Protected限定符

Protected限定符如同一个半开放的温室,允许花朵在组件及其子组件中被欣赏。但是,由于struct没有继承能力,protected限定符在ArkUI中对struct的成员变量没有实际意义,如同温室中的花朵,只能内部欣赏。

@Component
struct ProtectedGreenhouseComponent {
  @State protected tenderShoots: string = "Tender Shoots";

  build() {
    Column() {
      Text(this.tenderShoots)
        .fontSize(16)
        .fontWeight(FontWeight.Bold);
    }
  }
}

在这个例子中,tenderShoots变量是protected的,但由于struct的局限性,它实际上只能在这个组件内部被欣赏。

特殊的花间使者:Link和ObjectLink限定符

对于@Link和@ObjectLink变量,使用private限定符时会有编译告警,因为这些变量通常用于跨组件通信,需要在组件外部被欣赏和触碰,如同花间使者,传递着花粉和信息。

@Component
struct LinkFlowerComponent {
  @Link private connectedBloom: string = "Linked Bloom";

  build() {
    Column() {
      Text(this.connectedBloom)
        .fontSize(16)
        .onClick(() => this.connectedBloom = "Blooming Together");
    }
  }
}

在这个例子中,connectedBloom变量是private的,但由于它是@Link变量,它实际上需要在组件外部被欣赏和触碰,因此会有编译告警,如同花间使者在传递信息时遇到了障碍。

生命周期:花朵的成长之旅

每个自定义组件都有自己的生命周期,从它被播种到最终凋谢。了解这个生命周期对于管理组件的状态和资源至关重要,如同园丁了解花朵的生长周期,才能更好地照料它们。

花朵初绽:aboutToAppear

当组件即将在屏幕上绽放时,aboutToAppear方法会被调用。这是初始化组件状态和资源的好时机,如同花朵初绽,需要充足的阳光和水分。

@Component
struct BloomingComponent {
  private hasBloomed: boolean = false;

  aboutToAppear() {
    console.log('Component is about to bloom');
    this.hasBloomed = true;
  }

  build() {
    Column() {
      Text('Blooming Component')
        .fontSize(16)
        .fontWeight(FontWeight.Bold);
      If(this.hasBloomed, () => {
        Text('Component has bloomed at least once')
          .fontSize(12);
      });
    }
  }
}

在这个例子中,aboutToAppear方法在组件即将绽放时被调用,我们使用它来标记组件已经至少绽放了一次,如同记录花朵的绽放时刻。

花朵盛开:onDidBuild

当组件的build方法执行完成后,onDidBuild方法会被调用。这是执行后续逻辑的好时机,比如启动动画或执行网络请求,如同花朵盛开后,园丁开始修剪枝叶,准备下一次的绽放。

@Component
struct PostBuildComponent {
  onDidBuild() {
    console.log('Component has been built');
    // 启动动画或执行网络请求
  }

  build() {
    Column() {
      Text('Post Build Component')
        .fontSize(16)
        .fontWeight(FontWeight.Bold);
    }
  }
}

在这个例子中,onDidBuild方法在组件盛开后被调用,我们使用它来执行一些后续逻辑,如同园丁在花朵盛开后进行的维护工作。

花朵凋谢:aboutToDisappear

当组件即将从屏幕上消失时,aboutToDisappear方法会被调用。这是清理组件资源的好时机,比如取消网络请求或释放内存,如同花朵凋谢后,园丁清理花园,为下一次的绽放做准备。

@Component
struct DisappearingComponent {
  aboutToDisappear() {
    console.log('Component is about to disappear');
    // 清理资源
  }

  build() {
    Column() {
      Text('Disappearing Component')
        .fontSize(16)
        .fontWeight(FontWeight.Bold);
    }
  }
}

在这个例子中,aboutToDisappear方法在组件即将凋谢时被调用,我们使用它来清理组件的资源,如同园丁在花朵凋谢后清理花园。

自定义组件的访问控制和生命周期管理是构建高效、可维护的ArkUI应用的关键。通过合理使用访问限定符,我们可以确保组件的状态和行为按照我们的预期进行。同时,通过理解组件的生命周期,我们可以在合适的时机管理资源和执行逻辑。希望这些知识能帮助你在开发ArkUI应用时更加得心应手。记得,实践是最好的老师,所以赶紧动手试试吧!如果你有更多的问题,或者想要了解更多的高级技巧,不妨去社区论坛转转,或者直接找智能客服聊聊。下次再见,愿你的代码之花在HarmonyOS的世界中绽放得更加绚烂!

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
分类
标签
收藏
回复
举报
回复
    相关推荐