ArkTS的Watch装饰器

news2024/9/23 23:23:51

@Watch装饰器,相当于Vue中的监听器 以及 React中使用useEffect监听变量

使用@Watch装饰器,可以监听一个数据的变化,并进行后续的响应。
使用方法:
@Watch(‘回调函数’),写在@State装饰器后(其实写在前面也行,但是写到后面更加清晰也符合规范)。

@State @Watch('change') baseNumber: number = 1
change(){
    this.res = Math.pow(this.baseNumber,this.pow)
}

注意:回调函数中一定不能直接操作监听的数据,会造成死循环

下面是一个综合案例

@Entry
@Component

struct UseWatch {
  // 将监听器写到@State装饰器后面
  @State @Watch('change') baseNumber: number = 1
  @State pow: number = 2
  @State res: number = 1
  change(){
    this.res = Math.pow(this.baseNumber,this.pow)
  }
  build() {
      Column(){
        Text(`基数:${this.baseNumber}`)
          .fontSize(40)
          .onClick(() => {
            this.baseNumber++
          })
        Divider()
        Text(`次幂:${this.pow}`)
          .fontSize(40)
          .onClick(() => {
            this.pow ++
          })
        Divider()
        Text(`结果:${this.res}`)
          .fontSize(40)
      }
      .width('100%')
      .height('100%')
      .justifyContent(FlexAlign.Center)
  }
}

运行发现,点击 基数 时,即@Watch监听的数据发生变化时,执行了change函数
在这里插入图片描述
但是点击 次幂 时,由于@Watch监听的数据未发生改变,所以没执行change函数
在这里插入图片描述
再次点击 基数 时,重新执行change函数
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1315665.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

数据结构之---- 回溯算法

数据结构之---- 回溯算法 什么是回溯算法? 回溯算法是一种通过穷举来解决问题的方法,它的核心思想是从一个初始状态出发,暴力搜索所有可能的解决方案,当遇到正确的解则将其记录,直到找到解或者尝试了所有可能的选择都…

算法训练第三十九天|62. 不同路径、63. 不同路径 II

62. 不同路径: 题目链接 一个机器人位于一个 m x n 网格的左上角 (起始点在下图中标记为 “Start” )。 机器人每次只能向下或者向右移动一步。机器人试图达到网格的右下角(在下图中标记为 “Finish” )。 问总共有…

Slate基础使用说明

目录 Slate基础使用说明 1. 简单教程 2. 要点说明 2.1 TCommands以及TCommands基类 2.2 FUICommandInfo 2.3 FUICommandList 2.4 FUIAction 2.5 UICommand 3. 代码源码 4. 工具使用 4.1 Display Ul Extension Points 4. 参考文章 Slate基础使用说明 1.…

TCP/IP详解——HTTPS 协议

文章目录 1. HTTPS 协议1.1 HTTPS 原理1.2 HTTPS 过程1.3 从数据包角度看 HTTPS 交互过程1.4 常见的 HTTPS 数据包解码1.4.1 ClientHello 数据包1.4.2 ServerHello 数据包 1.5 思考 1. HTTPS 协议 1.1 HTTPS 原理 HTTPS概念 HTTPS 是以安全为目标的HTTP通道,并不…

在线弹钢琴网站源码,带练习教学和推销乐谱功能

源码介绍 AutoPiano-在线弹钢琴网站源码,在线钢琴模拟器,自由在线弹奏虚拟钢琴,是所有人的绝佳音乐平台。 背景图片在./static/images, 另外需要在js内的0.7fc8a67cbbcb823cf89e.js和1.f9a3f1dba143d1b59ca4.js修改图片对应路径。 钢琴声…

Docker 部署 Lobe Chat 服务

拉取最新版本的 Lobe Chat 镜像: $ sudo docker pull lobehub/lobe-chat:latest使用以下命令来运行 Lobe Chat 容器: $ sudo docker run -d --name lobe-chat -p 10084:3210 -e OPENAI_API_KEYsk-xxxx -e OPENAI_PROXY_URLhttps://api.openai.com/v1 -e ACCESS_CO…

《Linux C编程实战》笔记:实现自己的ls命令

关键函数的功能及说明 1.void display_attribute(struct stat buf,char *name) 函数功能:打印文件名为name的文件信息,如 含义分别为:文件的类型和访问权限,文件的链接数,文件的所有者,文件所有者所属的组…

2023年【公路水运工程施工企业安全生产管理人员】考试总结及公路水运工程施工企业安全生产管理人员试题及解析

题库来源:安全生产模拟考试一点通公众号小程序 公路水运工程施工企业安全生产管理人员考试总结根据新公路水运工程施工企业安全生产管理人员考试大纲要求,安全生产模拟考试一点通将公路水运工程施工企业安全生产管理人员模拟考试试题进行汇编&#xff0…

PCL点云处理之自定义生成多种类型的圆柱点云(C++)(二百二十五)

PCL点云处理之自定义生成多种类型的圆柱点云(C++)(二百二十五) 一、算法介绍1.空心圆柱点云2.实心圆柱点云二、算法实现1.生成方法1(空心)2.生成方法2(实心)一、算法介绍 根据自己指定的圆柱长度、圆柱半径、以及中心轴的方向,生成一个圆柱点云数据,保存在PCD文件中…

c#可变参数(params)关键字

通过使用 params 关键字,可以指定采用可变数量参数的方法参数。 可以发送参数声明中指定类型的参数的逗号分隔列表,也可以发送指定类型的参数数组。您也可以不发送任何参数。如果未发送任何参数,则参数列表的长度为零。 方法声明中的 param…

Anaconda中使用Jupyter出现’No module named ‘pymysql‘问题解决

问题截图: 解决办法: 一.找到Anaconda所在文件夹,文件夹处输入 cmd 进入命令控制 二. 在打开的cmd中输入‘conda install pymysql’ 三、输入y 安装完成~ 测试: import pandas as pd from sqlalchemy import create_engine …

同义词替换降低论文抄袭率的有效性探讨 papergpt

大家好,今天来聊聊同义词替换降低论文抄袭率的有效性探讨,希望能给大家提供一点参考。 以下是针对论文重复率高的情况,提供一些修改建议和技巧,可以借助此类工具: 标题:同义词替换降低论文抄袭率的有效性探…

Redis实现延迟队列

目录 一、什么是延时队列 二、延时队列的应用 三、举例说明 我的设计思想: 一、什么是延时队列 延时队列相比于普通队列最大的区别就体现在其延时的属性上,普通队列的元素是先进先出,按入队顺序进行处理,而延时队列中的元素在入队时会指定…

【Android12】WindowManagerService架构分析

Android WindowManagerService架构分析 WindowManagerService(以下简称WMS) 是Android的核心服务。WMS管理所有应用程序窗口(Window)的Create、Display、Update、Destory。 因为Android系统中只有一个WMS(运行在SystemServer进程),可以称其为…

拼多多ID取商品详情API:电商行业的秘密武器与实时数据获取的智慧之路

一、引言 电商行业是一个不断发展和创新的领域,各种电商平台不断涌现,为消费者提供了更加便捷和多样化的购物体验。拼多多作为中国电商市场的一匹黑马,以其独特的社交电商模式和丰富的商品资源,吸引了大量用户。为了满足用户对商…

多模态融合-MVP

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 前言在这里插入图片描述 通过将激光点云3D BBox投影道2D图像,可以发现激光对远处的目标检测要弱于传统的2D detector,所以作者想用2D的图像信息去补充3D的点云信息。一、MVP优势二、MVP方法1.Lid…

【QT】非常简单的登录界面实现

本系列是作者自学实践过程的记录 本文是关于登录界面设计 有问题欢迎讨论 效果图: 一、创建项目和主界面 创建Qt Widget Application 这里我们使用qmake而不是cmake 这是主界面,登录界面等后面再创建,这里要勾选上generate form&#xff0…

AI智能化办公:ChatGPT使用方法与技巧

文章目录 ChatGPT简介✨ChatGPT的使用方法✨登录与访问发送请求调整参数 ChatGPT技巧分享✨清晰的提问实验不同的温度值多轮对话 图书推荐✨AI智能化办公内容简介获取方式 AI短视频内容简介获取方式 随着人工智能技术的不断发展,AI助手在办公场景中扮演着越来越重要…

windows10 php8连接sql server

一、环境安装 文章目录 一、环境安装1.安装php拓展2.在 Windows 上安装PHP驱动程序3.在 Windows 上安装ODBC驱动 二、php连接sqlserver三、注意事项数据库相关设置相关语法sqlsrv_fetch_array 的示例:sqlsrv_fetch 的示例:echo 和 print_r 的不同 所用资…

抠图软件哪个好用?什么软件可以抠图换背景?

抠图软件哪个好用?在图片处理中,抠图换背景是一项常见的操作。很多新手可能会对此感到困惑,不知道应该使用什么软件来进行抠图换景。实际上,现在市面上有很多图片处理软件都具备抠图换背景的功能,每款软件都有其优缺点…