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

鸿蒙路由 HMRouter 配置及使用 二

1、路由跳转

创建测试页面OnePage

import { HMRouter } from "@hadss/hmrouter";

@HMRouter({
  pageUrl: "OnePage",
})
@Component
export struct OnePage {

  build() {
    Column() {
      Text("测试页面 - OnePage").fontSize(30).fontWeight(FontWeight.Bold)
    }
  }
}

首页添加页面跳转按钮

// 跳转按钮 - OnePage
     Button("跳转到 - OnePage").onClick((event: ClickEvent) => {
        HMRouterMgr.push({
          pageUrl: "OnePage",
          param: {
            name: "张三",
            age: 18
          }
        })
      })

跳转方法参数说明

HMRouterMgr.push({
 navigationId?: string; // 指定导航HMNavigation的navigationId
 pageUrl?: string; // push到哪个页面
 param?: ESObject; // 传参对象
 interceptors?: IHMInterceptor[]; // 指定路由拦截器
 animator?: IHMAnimator | boolean; // 指定跳转动画
 skipAllInterceptor?: boolean; // 是否跳过路由拦截
})

 

2、参数接收

在OnePage页面 通过getCurrentParam获取当前路由

@State param: HMPageParam = HMRouterMgr.getCurrentParam(HMParamType.all) as HMPageParam

  aboutToAppear(): void {
    console.log("OnePage aboutToAppear" + JSON.stringify(this.param))
  }

3、路由拦截器

创建拦截器目录及OnePage拦截器 ,拦截器需要实现IHMInterceptor接口并通过@HMInterceptor注解添加拦截器信息。

@HMInterceptor注解参数说明

IHMInterceptor接口需要实现handle方法。handle方法参数可以获取路由信息,方法返回值必须是一个HMInterceptorAction枚举。

import { HMInterceptor, HMInterceptorAction, HMInterceptorInfo,
  HMRouterPathInfo,
  IHMInterceptor } from '@hadss/hmrouter';

@HMInterceptor({ interceptorName: "OnePageInterceptor" })
export class OnePageInterceptor implements IHMInterceptor {
  handle(info: HMInterceptorInfo): HMInterceptorAction {
    const routerPathInfo: HMRouterPathInfo = info.routerPathInfo;
    // 如果是张三 停止跳转
    if(routerPathInfo.param?.name === "张三") {
      console.log("OnePageInterceptor - 张三 停止跳转")
      return HMInterceptorAction.DO_REJECT;
    }else {
      // 继续向下执行
      console.log("OnePageInterceptor - 继续向下执行")
      return HMInterceptorAction.DO_NEXT
    }
  }
}

 

在OnePage页面使用拦截器 

@HMRouter({
  pageUrl: "OnePage",
  interceptors: ["OnePageInterceptor"]
})


http://www.kler.cn/a/590349.html

相关文章:

  • WebSocket与MQTT协议深度对比:选择合适的通信协议
  • 如何用Python批量将CSV文件编码转换为UTF-8并转为Excel格式?
  • 技术与情感交织的一生 (一)
  • 现代密码学 | 具有数字签名功能的安全方案
  • Spring MVC 全面解析:架构、流程与核心组件(详细)
  • spring bean的生命周期和循环依赖
  • 【零基础入门unity游戏开发——unity2D篇】2D射线和范围检测之Physics2D Raycast、OverlapCircle、OverlapBox
  • golang函数与方法的区别
  • K8S快速部署
  • 新闻发布时间抽取分析
  • LinkedList和链表
  • 【MySQL】从零开始:掌握MySQL数据库的核心概念
  • containerd 拉取镜像的工具以及优劣
  • 系统架构设计师—案例分析—架构评估
  • LLM论文笔记 24: A Theory for Length Generalization in Learning to Reason
  • QT非UI设计器生成界面的国际化
  • Java 买百鸡问题
  • Google内购 Java服务端(Springboot)校验订单详细流程
  • 日志存储与分析
  • [贪心算法] 摆动序列