直接跳到内容

结果回传与通信

介绍

导航模块提供参数传递与结果回传能力。参数用于进入页面时携带数据,结果用于返回上一页时触发刷新或数据更新。

公共参数与结果

通用参数与结果放在 core/navigation/src/main/ets/ 下,供多模块复用。

ts
/**
 * @file 公共导航参数定义
 */
export interface IdParam {
  /**
   * ID
   */
  id: number;
}
ts
/**
 * @file 公共导航返回结果定义
 */
export interface RefreshResult {
  /**
   * 是否需要刷新
   */
  refresh?: boolean;
}

路由参数示例

通过 getRouteParams 获取当前路由参数,建议使用具体类型,避免 any

ts
import { BaseViewModel } from "base";
import { getRouteParams } from "navigation";
import { DemoGoodsParam } from "navigation/src/main/ets/demo/DemoParam";
import { DemoRoutes } from "navigation/src/main/ets/demo/DemoRoutes";

/**
 * @file 带参跳转示例页 ViewModel
 */
@ObservedV2
export default class NavigationWithArgsViewModel extends BaseViewModel {
  /**
   * 获取路由参数
   */
  routeParams: DemoGoodsParam = getRouteParams<DemoGoodsParam>(DemoRoutes.NavigationWithArgs);
}

DemoGoodsParam 定义在 core/navigation/src/main/ets/demo/DemoParam.ets

ts
/**
 * @file Demo 模块导航参数定义
 */

/**
 * 商品参数
 */
export interface DemoGoodsParam {
  /**
   * 商品 ID
   */
  goodsId: number;
  /**
   * 商品名称
   */
  goodsName: Resource;
}

结果回传示例

发起方 ViewModel(推荐:Navigator)

ts
import { BaseViewModel } from "base";
import { DemoNavigator } from "navigation";
import type { DemoResult } from "navigation/src/main/ets/demo/DemoResult";

/**
 * @file 结果回传发起方 ViewModel
 */
@ObservedV2
export default class NavigationResultCallerViewModel extends BaseViewModel {
  /**
   * 打开结果页并处理回传
   * @returns {void} 无返回值
   */
  openResultPage(): void {
    DemoNavigator.toNavigationResult()
      .then((result?: DemoResult): void => {
        if (result) {
          console.info("[NavigationResult] title=", result.title); // 根据回传结果更新页面
        }
      });
  }
}

发起方 ViewModel(直接使用 NavigationService)

ts
import { BaseViewModel } from "base";
import { navigateToForResult } from "navigation";
import { DemoRoutes } from "navigation/src/main/ets/demo/DemoRoutes";
import type { DemoResult } from "navigation/src/main/ets/demo/DemoResult";

/**
 * @file 结果回传发起方 ViewModel
 */
@ObservedV2
export default class NavigationResultCallerViewModel extends BaseViewModel {
  /**
   * 打开结果页并处理回传
   * @returns {void} 无返回值
   */
  openResultPage(): void {
    navigateToForResult<DemoResult>(DemoRoutes.NavigationResult)
      .then((result?: DemoResult): void => {
        if (result) {
          console.info("[NavigationResult] title=", result.title);
        }
      });
  }
}

目标页 ViewModel

ts
import { BaseViewModel } from "base";
import { DemoResult, navigateBackWithResult } from "navigation";

/**
 * @file 结果回传示例页 ViewModel
 */
@ObservedV2
export default class NavigationResultViewModel extends BaseViewModel {
  /**
   * 标题输入值
   */
  @Trace
  titleInput: string = "";

  /**
   * 说明输入值
   */
  @Trace
  descInput: string = "";

  /**
   * 组装结果并返回上一页
   * @returns {void} 无返回值
   */
  submitResult(): void {
    // 组装结果
    const result: DemoResult = {
      title: this.titleInput.trim(),
      description: this.descInput.trim()
    };
    // 回传结果并关闭当前页
    navigateBackWithResult(result);
  }
}

注意事项

  • 参数与结果优先定义为实体类,统一放在模块的 Param / Result 文件中。
  • 结果回传通常配合页面刷新逻辑使用,避免在页面里直接操作导航栈。