当前位置: 首页 > news >正文

路由---页面切换

本次一共需要三个页面切换 需要写出三个文件

实例代码1:

import router from '@ohos.router'; @Entry @Component struct meng{ @State username:string ="" @State password:string ="" @State password2:string ="" build() { Column({space:25}){ Image($r('app.media.cxstudy_1781085599889')) .width(120) .height(120) .borderRadius(60) Text("注册") .fontSize(32) .fontWeight(FontWeight.Bolder) Row(){ Text("账号") .fontSize(26) .width('40%') .textAlign(TextAlign.Center) TextInput({text:this.username}) .width('60%') .height(50) .onChange((value:string)=>{ this.username =value }) } Row(){ Text("密码") .fontSize(26) .width('40%') .textAlign(TextAlign.Center) TextInput({text:this.password}) .width('60%') .height(50) .type(InputType.Password) .onChange((value:string)=>{ this.password =value }) } Row(){ Text("确认密码") .fontSize(26) .width('40%') .textAlign(TextAlign.Center) TextInput({text:this.password2}) .width('60%') .height(50) .type(InputType.Password) .onChange((value:string)=>{ this.password2 =value }) } Text("已有账号,立即登录") .fontSize(22) .fontColor(0xababab) .onClick(()=>{ router.pushUrl({ url:"pages/Home" }) }) Button("立即注册") .width('100%') .height(50) .fontSize(24) .onClick(()=>{ if ((this.username!="")&&(this.password2!="")&&(this.password==this.password2)){ router.pushUrl({ url: "pages/yuyuyu" }) } else{ AlertDialog.show({ title:"注册失败", message:'注册的两次密码为空或者不一致,${this.username}' }) } }) } .width('100%') .height('100%') .padding(15) } }

实例代码2:

import router from '@ohos.router'; @Entry @Component struct yuyuyu{ build() { Column({space:25}){ Image($r('app.media.cxstudy_1781085599889')) .width(120) .height(120) .borderRadius(60) Text("登 录") .fontSize(32) .fontWeight(FontWeight.Bold) Row({space:15}){ Text("账 号") .fontSize(26) TextInput() .width("70%") .height(50) } Row({space:15}){ Text("密 码") .fontSize(26) TextInput() .width("70%") .height(50) .type(InputType.Password) } Text("没有账号,立即注册") .fontSize(22) .fontColor(0xababab) .onClick(()=>{ router.pushUrl({ url:"pages/meng" }) }) Button("立 即 登 录") .width('100%') .height(50) .fontSize(24) .onClick(()=>{ router.pushUrl({ url:"pages/Home" }) }) } .width('100%') .height('100%') .padding(15) } }

实例代码3:

import router from '@ohos.router'; @Entry @Component struct HomePage { @State username: string = "" onPageShow(): void { const params = router.getParams() as Record<string, string> if (params) { this.username = params.username } } build() { Column() { Text(`你好 ${this.username}`) } } }

特别注意:需要在json文件添加本文件名

如图所示:

成果展示1:

成果展示2:

成果展示3:

http://www.cnnetsun.cn/news/3024368.html

相关文章:

  • 100个RPG Maker MV插件:零代码打造专业级游戏体验
  • 大厂Agent架构我拆了三遍,发现一人公司只需要3个文件(附模板)
  • 源头厂家优势凸显!无锡百瑞德TIG热丝堆焊设备厂家实力解读
  • 电动赛车BMS系统设计与LTC6813应用实践
  • 用友NC psnImage/download接口SQL注入漏洞复现与防御分析
  • 2026不想996?这些外企、券商的技术岗校招正在偷偷抢人
  • 2026年国内GEO培训机构双师资深度拆解:为什么双讲师实战授课,落地成功率远超单理论讲师体系
  • 智能车竞赛光电组电调系统优化实践
  • 深度解析OpenSpeedy:重新定义游戏时间操控的技术革命
  • 如何修复“您的 IP 地址已被封禁”的网络错误?
  • 市面上专业的CD3E膜蛋白供应商口碑
  • 智慧转型AI与AR的革命
  • 【教程】Altera Reset Release IP 的介绍与使用举例
  • IP-guard Webserver远程命令执行漏洞应急响应实战复盘
  • 如何诊断和修复Steam Achievement Manager成就数据加载异常问题
  • 亚马逊QA怎么做?Review留评与点赞运营技巧全面解析
  • 如何用Python三分钟搞定A股行情数据获取?mootdx技术深度解析
  • C++部署比Python再快15%,VLM推理的最后一公里
  • 山东诺亚创生带你了解人体“万能维修工”干细胞
  • 3分钟搞定抖音直播数据采集:零基础也能玩转的弹幕抓取神器
  • iOS OC 项目集成 C++ 算法库完整指南
  • PCB走线S21插损:从-1dB到-6dB,信号到底衰减了多少?
  • AI多模型统一调度如何破局?2026六大API中转与聚合平台技术横评与选型解析
  • 原神月之八版本时间 可以用手机远程玩原神吗
  • 如何突破原神帧率限制:genshin-fps-unlock完整使用指南
  • EI会议早鸟价!第三届机电一体化、机器人与控制系统国际学术会议(MRCS 2026)
  • 学生台灯什么牌的最好?甄选学生台灯顶流品牌口碑王,家长必看
  • 如何用开源工具实现抖音内容智能批量下载:架构解析与实战指南
  • 【软工方法论28】代码评审最佳实践
  • 罗技PUBG压枪宏:三步实现终极后坐力控制的完整技术指南