鸿蒙Next 支持数据双向绑定的组件:Checkbox--Search--TextInput

Checkbox

$$语法,$$绑定的变量发生变化时,会触发UI的刷新

@Entry
@Component
struct MvvmCase {
@State
isMarry:boolean = false@StatesearchText:string = ''build() {Grid(){GridItem(){Column(){Text("checkbox 的双向绑定")Checkbox().select($$this.isMarry)Text(this.isMarry+"")Button('改变').onClick(()=>{this.isMarry=!this.isMarry})}}.height(200).backgroundColor(Color.Yellow)}.width('100%').height('100%').columnsTemplate("1fr 1fr").columnsGap(20).rowsGap(20)}
}

Search

@Entry
@Component
struct MvvmCase {
@State
isMarry:boolean = false@StatesearchText:string = ''build() {Grid(){GridItem(){Column(){Text("search 的双向绑定")Search({value:$$this.searchText})Text(this.searchText+"")Button('改变').onClick(()=>{this.searchText='老宋你好'})}}.height(200).backgroundColor(Color.Pink)}.width('100%').height('100%').columnsTemplate("1fr 1fr").columnsGap(20).rowsGap(20)}
}

​​​​​​​ 

TextInput

@Entry
@Component
struct MvvmCase {
@State
isMarry:boolean = false@StatesearchText:string = ''controller: TextInputController = new TextInputController()build() {Grid(){GridItem(){Column(){Text("TextInput 的双向绑定")TextInput({ text: $$this.searchText, placeholder: 'TextInput 的双向绑定', controller: this.controller })Text(this.searchText+"")Button('改变').onClick(()=>{this.searchText='老宋你好01'})}}.height(200).backgroundColor(Color.Pink)}.width('100%').height('100%').columnsTemplate("1fr 1fr").columnsGap(20).rowsGap(20)}
}

还有很多组件都支持双向绑定

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

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

相关文章

【GPT-SOVITS-04】SOVITS 模块-鉴别模型解析

说明:该系列文章从本人知乎账号迁入,主要原因是知乎图片附件过于模糊。 知乎专栏地址: 语音生成专栏 系列文章地址: 【GPT-SOVITS-01】源码梳理 【GPT-SOVITS-02】GPT模块解析 【GPT-SOVITS-03】SOVITS 模块-生成模型解析 【G…

机器学习_线性回归

文章目录 线性回归的定义损失函数(误差大小)梯度下降算法梯度下降的API(LinearRegression)均方误差(Mean Squared Error)MSE) 评价机制最小二乘法之正规方程正规方程vs梯度下降 欠拟合与过拟合回归算法之岭回归L2正则化 线性回归的定义 线性回归的定义是:目标值预期…

html5cssjs代码 022 表单输入类型示例

html5&css&js代码 022 表单输入类型示例 一、代码二、解释 这段HTML代码定义了一个网页&#xff0c;展示了表单输入类型示例。 一、代码 <!DOCTYPE html> <html lang"zh-cn"> <head><title>编程笔记 html5&css&js 表单输入…

短剧小程序软件开发首页接口转发到Selectpage

工具&#xff1a;用的是uniapp开发 技术栈&#xff1a;vue、nide..js、云开发 用时&#xff1a;20工作天 软件&#xff1a;Hb、微信开发者工具 <?php namespace app\api\controller; use app\common\controller\Api; /** * 首页接口 */ class Index extends Api { …

pytorch卸载cuda+cudnn并重新配置GPU环境,亲测有效

pytorch卸载cudacudnn 一、卸载cuda 进入【控制面板】&#xff0c;点击【卸载程序】 将红色框中带版本号的都卸载 二、删除cudnn配置 1、进入安装路径 将以下版本号文件直接删除 pytorch配置GPU环境 一、查看支持的cuda最高版本 1、winr&#xff0c;输入cmd&#xf…

【开源】SpringBoot框架开发二手车交易系统

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 二手车档案管理模块2.3 车辆预约管理模块2.4 车辆预定管理模块2.5 车辆留言板管理模块2.6 车辆资讯管理模块 三、系统设计3.1 E-R图设计3.2 可行性分析3.2.1 技术可行性分析3.2.2 操作可行性3.2.3 经济…

单片机原理

AT89S51单片机片内硬件结构 &#xff08; 本节以AT89S51为例介绍51单片机的基本结构&#xff0c;如下图所示&#xff09; AT89S51单片机的片内结构&#xff0c;从图中可见 AT89S51单片机的基本组成&#xff1a; 1. CPU&#xff1a;8位的CPU 由控制器和运算器构成 2. 数据存…

【Frida】04_Frida中使用TypeScript脚本(采坑)

▒ 目录 ▒ &#x1f6eb; 导读需求开发环境演示目标 1️⃣ 操作步骤安装node 20.10.0在 VSCode 中打开项目目录初始化一个 NodeJS 项目安装 TypeScript初始化 TypeScript 项目安装依赖配置 TypeScript编写代码编译设置编译脚本运行&#xff0c;查看结果 2️⃣ 采坑frida-compi…

WEB前端项目开发——(一)(2024)

目录 1 通过Git Bash安装 vue-cli 2 创建项目 3 解决Git Bash方向键失效 4 重新进行项目创建 5 浏览器输入地址查看 6 案例——简单修改v3-calendar中的内容 7 测试页面效果 本篇文章介绍通过了Git Bash创建v3-calendar项目&#xff0c;之后对v3-calendar进行简单…

使用gitee自动备份文件

需求 舍友磁盘前两天gg了&#xff0c;里面的论文没有本地备份&#xff0c;最后费劲巴拉的在坚果云上找到了很早前的版本。我说可以上传到github&#xff0c;建一个私人仓库就行了&#xff0c;安全性应该有保证&#xff0c;毕竟不是啥学术大亨&#xff0c;不会有人偷你论文。但是…

R语言:microeco:一个用于微生物群落生态学数据挖掘的R包,第四:trans_beta class

trans_beta class&#xff1a;利用trans_beta类可以变换和绘制beta分集的距离矩阵。该类中涉及到beta多样性的分析主要包括排序、群距、聚类和方差分析。我们首先使用PCoA显示排序。 > dataset$cal_betadiv() The result is stored in object$beta_diversity ... > t1 &…

ClickHouse中的设置的分类

ClickHouse中的各种设置 ClickHouse中的设置有几百个&#xff0c;下面对这些设置做了一个简单的分类。

游戏引擎中网络游戏的基础

一、前言 网络游戏所面临的挑战&#xff1a; 一致性&#xff1a;如何在所有的主机内都保持一样的表现可靠性&#xff1a;网络传输有可能出现丢包安全性&#xff1a;反作弊&#xff0c;反信息泄漏。多样性&#xff1a;不同设备之间链接&#xff0c;比如手机&#xff0c;ipad&a…

C到C++的敲门砖-2

文章目录 引用内联函数auto关键字基于范围的for循环指针空值nullptr后记 引用 引用不是新定义一个变量&#xff0c;而是给已存在变量取了一个别名&#xff0c;编译器不会为引用变量开辟内存空 间&#xff0c;它和它引用的变量共用同一块内存空间。 所谓引用就是给变量起别名&am…

RUST egui体验

egui官方提供了web版的demo&#xff0c;效果还是很不错的&#xff0c;就是用的时候有点一头雾水&#xff0c;没有找到明确的指导怎么把这些组件插入到自己的application或者web。花了一天时间撸了一遍流程&#xff0c;记录一下&#xff0c;说不定以后能用到呢 >_< efram…

asp.net 作业星软件系统

asp.net 作业星软件系统 用户功能:分教师和家长&#xff08;学生) 注册登录:登录部分是用户名密码&#xff0c;以及教师和家长&#xff08;学生&#xff09;的勾选; 注册包括用户名密码确认密码再次确认密码(与上方输入的密码比对&#xff09;身份班级设置找回账号的问题和答案…

【人工智能】英文学习材料01(每日一句)

&#x1f33b;个人主页&#xff1a;相洋同学 &#x1f947;学习在于行动、总结和坚持&#xff0c;共勉&#xff01; 目录 1.Natural Language Processing&#xff0c;NLP&#xff08;自然语言处理&#xff09; 2.Machine Learing&#xff0c;ML&#xff08;机器学习&#xf…

FFplay使用滤镜添加字幕到现有视频显示

1.创建字幕文件4k.srt 4k.srt内容: 1 00:00:01.000 --> 00:00:30.000 日照香炉生紫烟2 00:00:31.000 --> 00:00:60.000 遥看瀑布挂前川3 00:01:01.000 --> 00:01:30.000 飞流直下三千尺4 00:01:31.000 --> 00:02:00.000 疑是银河落九天2.通过使用滤镜显示字幕在视…

【GPT-SOVITS-03】SOVITS 模块-生成模型解析

说明&#xff1a;该系列文章从本人知乎账号迁入&#xff0c;主要原因是知乎图片附件过于模糊。 知乎专栏地址&#xff1a; 语音生成专栏 系列文章地址&#xff1a; 【GPT-SOVITS-01】源码梳理 【GPT-SOVITS-02】GPT模块解析 【GPT-SOVITS-03】SOVITS 模块-生成模型解析 【G…

llama笔记:官方示例解析 example_chat_completion.py

1 导入库 from typing import List, Optional从typing模块中导入List和Optional。typing模块用于提供类型注解的支持&#xff0c;以帮助明确函数预期接收和返回的数据类型。List用于指定列表类型Optional用于指定一个变量可能是某个类型&#xff0c;也可能是None。 import fir…