HarmonyOS 鸿蒙Next 如何写一个通用的onClick

HarmonyOS 鸿蒙Next 如何写一个通用的onClick

例如想写一个自定义的onClick，在内部实现1秒内只能点一次的逻辑，然后给其他UI组件使用，应该怎么做

2 回复

可参考：

function throttle(func: Function, interval: number) {
  let lastTime = 0;
  return () => {
    const nowTime = Date.now();
    const remainTime = interval - (nowTime - lastTime);
    if (remainTime <= 0) {
      lastTime = nowTime;
      func();
    }
  };
}

@Entry
@Component
struct OnclickPage {
build() {
Column() {
Button(“防止重复点击”).onClick(throttle(() => {
console.log(‘点击’)
}, 2000)).margin(50)
}.width(‘100%’).height(‘100%’)
}
}

更多关于HarmonyOS 鸿蒙Next 如何写一个通用的onClick的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS（鸿蒙）系统中，编写一个通用的onClick事件处理器通常涉及使用ArkUI框架（包括JavaScript/eTS或Dart语言）来定义用户界面的交互逻辑。以下是一个基于eTS（Extended TypeScript）的示例，展示如何为按钮设置通用的onClick处理函数：

  1. 定义按钮和事件处理器：
@Entry
@Component
struct MyComponent {
  @State message: string = "Hello, HarmonyOS!"

  onClickHandler(event: TouchEvent): void {
    this.message = "Button Clicked!"
  }

  build() {
    Column() {
      Button("Click Me")
        .onClick((event: TouchEvent) => this.onClickHandler(event))
      Text(this.message)
    }.padding(20)
  }
}

在这个示例中，Button组件的onClick属性绑定了一个箭头函数，该函数调用onClickHandler方法。当按钮被点击时，onClickHandler会更新message状态，从而在界面上显示新的文本。

  1. 注意事项：
    • 确保你已经正确设置和引入了HarmonyOS的开发环境和依赖。
    • onClick事件处理函数应接收一个TouchEvent类型的参数。

如果问题依旧没法解决请联系官网客服，官网地址是：https://www.itying.com/category-93-b0.html

回到顶部