当前位置: 首页 > 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.jsqmd.com/news/1083949/

相关文章:

  • [论文汇整-可用于综述或引言]AI Agent在不同行业的应用
  • 使用kaggle完成导游助手大项目
  • 程序员职业规划:一篇讲清核心用法
  • TaleStreamAI:6小时完成AI小说推文制作的终极自动化工具
  • 127、调试手记:为什么数据到了对端,CRC却对不上?
  • QuickQanava 源码阅读笔记(二):edge、容器适配器与 noexcept 的极致
  • 深度剖析 Musl libc 线程私有数据 (TSD):极简的 Key 管理与析构机制
  • AI写论文有妙招!4款AI论文生成工具,解决你的写作难题!
  • 开源游戏加速工具OpenSpeedy的3大突破性架构解析
  • [Android] Blackmagic Camera_3.3.2专业录制-解锁手机的强大功能
  • 探索SDR++:5个让无线电世界触手可及的核心优势
  • Kubernetes ConfigMap 与 Secret 实战指南
  • 国家社科基金项目申报资料(含申报书范本,立项清单、各阶段报告及申报经验)
  • QMCDecode:macOS上快速解密QQ音乐加密音频的终极指南
  • 计算机游戏的事件-数据库架构:2025-2026出版新书的《人月神话》引用(5)
  • CST电磁仿真如何将GRIN透镜天线用于6G
  • 树莓派官方触屏Touch Display 2硬件解析与实战避坑指南
  • 2026年国内GEO培训机构深度研究,算法迭代教学详解:为什么学旧打法3个月必失效
  • 女性肠道养护与全维度养生科普,莱香发酵膳食辅助调理知识分享
  • 【JetBrains认证专家实测】:Eclipse项目导入IDEA成功率提升97.3%的6项关键配置
  • 自然科考研学,理科生专属高阶社会实践项目
  • Web 安全实战:身份验证与会话管理漏洞全方位攻防测试笔记
  • 从零掌握Locust:Python协程驱动的高并发负载测试实战指南
  • 每日 Agent 核心知识Day12:安全与合规核心知识(Agent 生命线)
  • 山东先进网上阅卷公司有哪些
  • 从Kac-Moody代数到群概形:构造、完备化与仿射型实现
  • 阴阳师自动化脚本终极指南:智能游戏管家解放你的双手
  • 终极指南:如何用QMCDecode快速解锁QQ音乐加密文件
  • CAD Electrical 2027安装教程(2026年保姆级超详解)【附安装包+电气符号原理图指南】
  • 【JAVA毕设源码分享】基于springboot小型哺乳类宠物诊所管理系统的设计与实现(程序+文档+代码讲解+一条龙定制)