HarmonyOS router页面跳转

news2024/11/29 10:35:52

默认启动页面index.ets

import  router from '@ohos.router'
import  {BusinessError} from '@ohos.base'

@Entry
@Component
struct Index {
  @State message: string = 'Hello World';

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)

        //添加按钮,以响应用户点击
        Button(){
          Text('Next')
            .fontSize(30)
            .fontWeight(FontWeight.Bold)
        }
        .type(ButtonType.Capsule)
        .margin({
          top:20
        })
        .backgroundColor('#00D9FFB')
        .width('40%')
        .height('5%')
        //跳转按钮绑定onclick事件,点击跳转到目标页面
        .onClick(()=>{
          console.log(`Succeeded in clicking the 'Next' button.`);
          router.pushUrl({url:'pages/TargetPage'}).then(()=>{
            console.info('Succeeded in jumping to the second page.')
          }).catch((err: BusinessError) => {
            console.error(`Failed to jump to the second page.Code is ${err.code}, message is ${err.message}`)
          })
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

跳转目标页面TargetPage.ets

// 导入页面路由模块
import router from '@ohos.router';
import { BusinessError } from '@ohos.base';

@Entry
@Component
struct TargetPage {
  @State message: string = '鸿蒙小趣';

  build() {
    Row() {
      Column() {
        Text(this.message)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
        Button(){
          Text('Back')
            .fontSize(25)
            .fontWeight(FontWeight.Bold)
        }
        .type(ButtonType.Capsule)
        .margin({top:20})
        .backgroundColor('#0D9FFB')
        .width('40%')
        .height('5%')
        // 返回按钮绑定onClick事件,点击按钮时返回到第一页
        .onClick(()=>{
          console.info(`Succeeded in clicking the 'Back' button.`)
          try {
            // 返回第一页
            router.back()
            console.info('Succeeded in returning to the first page.')
          }catch (err){
            let code = (err as BusinessError).code;
            let message = (err as BusinessError).message;
            console.error(`Failed to return to the first page.Code is ${code}, message is ${message}`)
          }
        })
      }
      .width('100%')
    }
    .height('100%')
  }
}

运行效果图如下:

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

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

相关文章

简约火箭发射静态404错误页面源码

简约火箭发射静态404错误页面源码,源码由HTMLCSSJS组成,记事本打开源码文件可以进行内容文字之类的修改,双击html文件可以本地运行效果,也可以上传到服务器里面,重定向这个界面 蓝奏云下载:https://wfr.lanzout.com/iK…

烦人的鼠标唤醒电脑功能彻底禁用

1.常规操作禁用鼠标唤醒 搜索设备 电源管理取消勾选 这样操作后, 系统更新等各种原因, 又会失效, 需要反复操作, 很烦 2.关闭计算机管理的计划任务 禁用 3.查询唤醒原因 powercfg /waketimers powercfg /lastwake

多模态学习综述(MultiModal Learning)

最早开始关注到多模态机器学习是看到Jeff Dean在2019年年底NeurIPS大会上的一个采访报道,讲到了2020年机器学习趋势:多任务和多模态学习将成为突破口。 Jeff Dean 谈2020年机器学习趋势:多任务和多模式学习将成为突破口 站在2022年&#xff…

华为模拟器防火墙配置实验(四)

实验拓扑图 需求: 1,办公区设备可以通过电信链路和移动链路正常上网(多对多的NAT,并且需要保存一个公网IP不能用来转换) 2,分公司的设备可以通过总公司的移动链路和电信链路访问DMZ区域的http服务器 3&…

VSCODE上使用python_Django

接上篇 https://blog.csdn.net/weixin_44741835/article/details/136135996?csdn_share_tail%7B%22type%22%3A%22blog%22%2C%22rType%22%3A%22article%22%2C%22rId%22%3A%22136135996%22%2C%22source%22%3A%22weixin_44741835%22%7D VSCODE官网: Editing Python …

python+django咖啡网上商城网站

全网站共设计首页、咖啡文化、咖啡商城、个人信息、联系我们5个栏目以及登录、注册界面,让用户能够全面的了解中国咖啡咖啡文化宣传网站以及一些咖啡知识、文化。 栏目一首页,主要放置咖啡的起源及发展进程的图文介绍;栏目二咖啡文化&#xf…

FPGA 高速接口(LVDS)

差分信号环路测试 1 概述 LVDS(Low Voltage Differential Signalin)是一种低振幅差分信号技术。它使用幅度非常低的信号(约350mV)通过一对差分PCB走线或平衡电缆传输数据。大部分高速数据传输中,都会用到LVDS传输。 …

多维时序 | Matlab实现基于VMD-DBO-LSTM、VMD-LSTM、LSTM的多变量时间序列预测

多维时序 | Matlab实现基于VMD-DBO-LSTM、VMD-LSTM、LSTM的多变量时间序列预测 目录 多维时序 | Matlab实现基于VMD-DBO-LSTM、VMD-LSTM、LSTM的多变量时间序列预测预测效果基本介绍程序设计参考资料 预测效果 基本介绍 Matlab实现基于VMD-DBO-LSTM、VMD-LSTM、LSTM的多变量时间…

06 分频器设计

分频器简介 实现分频一般有两种方法,一种方法是直接使用 PLL 进行分频,比如在 FPGA 或者 ASIC 设计中,都可以直接使用 PLL 进行分频。但是这种分频有时候受限于 PLL 本身的特性,无法得到频率很低的时钟信号,比如输入 …

LeetCode 热题 100 Day01

哈希模块 哈希结构: 哈希结构,即hash table,哈希表|散列表结构。 图摘自《代码随想录》 哈希表本质上表示的元素和索引的一种映射关系。 若查找某个数组中第n个元素,有两种方法: 1.从头遍历,复杂度&#xf…

【Node-RED】安全登陆时,账号密码设置

【Node-RED】安全登陆时,账号密码设置 前言实现步骤密码生成setting.js 文件修改 安全权限 前言 Node-RED 在初始下载完成时,登录是无账号密码的。基于安全性考虑,本期博文介绍在安全登陆时,如何进行账号密码设置。当然&#xff…

spring boot自动装配及自动装配条件判断

第一步需要在pom.xml文件指定需要导入的坐标 要是没有自动提示需要检查maven有没有 实现代码 /*springboot第三方自动配置实现方法 * 什么是自动配置 自动配置就是springboot启动自动加载的类不需要在手动的控制反转自动的加入bean中 * * *//*第一种方案包扫描 不推荐因为繁琐…

CentOS 7.9如何禁止内核自动更新升级

要在 CentOS 7.9 系统中禁止内核自动更新,你可以通过配置 YUM(Yellowdog Updater, Modified)来实现。这里有几种方法可以阻止内核自动更新: 方法 1: 使用 exclude 选项在 YUM 配置中 编辑 YUM 的配置文件 /etc/yum.conf&#xff…

第三篇【传奇开心果系列】Python的文本和语音相互转换库技术点案例示例:pyttsx3实现语音助手经典案例

传奇开心果短博文系列 系列短博文目录Python的文本和语音相互转换库技术点案例示例系列 短博文目录一、项目背景和目标二、雏形示例代码三、扩展思路介绍四、与其他库和API集成示例代码五、自定义语音示例代码六、多语言支持示例代码七、语音控制应用程序示例代码八、文本转语音…

【C语言】Debian安装并编译内核源码

在Debian 10中安装并编译内核源码的过程如下: 1. 安装依赖包 首先需要确保有足够的权限来安装包。为了编译内核,需要有一些基础的工具和库。 sudo apt update sudo apt upgrade sudo apt install build-essential libncurses-dev bison flex libssl-d…

kettle中JavaScript使用例子

1.将输入日期减一后,得到对应格式的输出 输入为20240216则Alert输出20240215 日期减一。 对应函数参考: https://blog.csdn.net/doasmaster/article/details/112978529

激光条纹中心线提取算法FPGA实现方案

1 概述 激光条纹中心线提取是3D线激光测量领域一个较为基础且重要的算法。目前,激光条纹中心线提取已有多种成熟的算法,有很多相关的博客和论文。 激光条纹中心线提取的真实意义在于工程化和产品化的实际应用,而很多算法目前只能用于学术研究…

Days 34 ElfBoard 音频接口

音频接口介绍 音频模块采用了 NAU88C22 芯片,芯片数据信号使用 I2S 接口进行通讯,主要信号功能: SAI_MCLK:音频信号主时钟; SAI_BCLK:音频信号位时钟; SAI_SYNC:左右声道控制信号&am…

2024-2-18-IO作业

作业: 1> 要求: 源代码: #include "myhead.h" int main(int argc, char const *argv[]) {FILE *fpNULL;if ((fpfopen("./text.txt","r"))NULL){perror("fopen error");return -1;}char buf[64]{0};int lin…

GPT-5,奥特曼最新剧透

GPT-5的消息越来越藏不住了,连OpenAI CEO奥特曼都不再遮遮掩掩—— 开始在各种公开场合频繁造势,不断挑动科技圈的神经。 在达沃斯经济论坛,奥特曼一共参加了4-5场活动,透露的关键信息包括: 如果GPT-4目前解决了人类…