Skip to content

JS-API(Pangea2.0 扩展)

Pangea2.0 已集成了新版的前端低代码引擎,为了更方便的使用,我们将 Pangea2.0 脚手架中的部分能力传入到了低代码引擎,使在编写页面 js 时可直接使用。

特别注意

为保证 Pangea2.0 各系统页面的兼容性,扩展 JS-API 由盘古团队统一添加。需要添加扩展 API 可联系盘古团队。

全局数据

获取用户信息 getUserInfo

该方法用于获取登录人员信息对象数据,包含用户账号、用户名等信息。

js
function action(ctx) {
  const userObj = ctx.injected.getUserInfo();
}

获取头部信息 getHttpHeaders

该方法用于获取 token,current_id 等 header 中的传参信息

js
function action(ctx) {
  const headers = ctx.injected.getHttpHeaders();
}

全局动作

路由跳转 navigateTo

该方法用于跳转页面

js
function action(ctx) {
  ctx.injected.navigateTo(path, params);
}

path 路由路径; params 路由参数;

路由回退(仅用于移动) navigateBack

用于返回上一个路由

js
function action(ctx) {
  ctx.injected.navigateBack();
}

路由前进或后退(仅用于移动) navigateGo

用于路由前进或后退

js
function action(ctx) {
  ctx.injected.navigateGo(n);
}

n 路由前进或后退层级;

关闭当前标签页(仅用于 pc 端) closeCurrentTab

该方法用于关闭当前标签页

js
function action(ctx) {
  ctx.injected.closeCurrentTab();
}

关闭指定标签页(仅用于 pc 端) closeTargetTab

该方法用于关闭指定标签页

js
function action(ctx) {
  ctx.injected.closeTargetTab(tabKey);
}

tabKey标签页的key(也是标签页的路由路径)

关闭所有标签页(仅用于 pc 端) closeAllTab

该方法用于关闭所有标签页

js
function action(ctx) {
  ctx.injected.closeAllTab();
}

设置Store全局参数 setStoreParam

该方法用于将数据存储到全局store中,其他页面也可获取到

js
function action(ctx) {
  ctx.injected.setStoreParam(params);
}
// 示例
ctx.injected.setStoreParam({code: "xxx"})

params 数据类型为对象,key为存储的字段名,value为存储的数据;

获取Store全局参数 getStoreParam

该方法用于获取存储在全局store中的参数

js
function action(ctx) {
  ctx.injected.getStoreParam(paramsName);
}
// 示例
ctx.injected.getStoreParam("code")

paramsName 数据类型为字符串,为获取的字段名;

监听事件(仅用于pc) onEvent

该方法用于监听某个事件

js
function action(ctx) {
  ctx.injected.onEvent(eventName, callback);
}

eventName 监听的事件名称; callback 事件触发时的回调函数;

触发事件(仅用于pc) emitEvent

该方法用于触发某个事件

js
function action(ctx) {
  ctx.injected.emitEvent(eventName, params);
}

eventName 触发的事件名称; params 触发事件时传递的参数,上方onEvent的callback回调函数中会接收到;

取消监听事件(仅用于pc) offEvent

该方法用于取消监听某个事件

js
function action(ctx) {
  ctx.injected.offEvent(eventName);
}

eventName 取消监听的事件名称;

工具方法

获取 url 参数 getUrlParam

该方法用于获取 url 参数

js
function action(ctx) {
  const value = ctx.injected.getUrlParam(name);
}

name 参数名称;

日期格式换 dateFormat

该方法用于对日期数据进行格式化

js
function action(ctx) {
  const date = ctx.injected.dateFormat(date, formatStr);
}

date日期值可为日期字符串,日期对象,时间戳等,也可为 null,为 null 时获取当前日期进行格式化

formatStr格式化字符串,例如:YYYY-MM-DD

流数据文件下载(仅用于 pc 端) download

该方法用于处理流数据为下载文件

js
function action(ctx) {
  ctx.injected.download(blobData, fileName);
}

blobData接口返回的 blob 数据

fileName文件名,例如:多语言.xlsx

将列表数据转换为 Excel 下载(仅用于 pc 端) exportToExcel

该方法用于处理列表数据导出为 excel 文件。该方法仅用于数据转换不进行接口处理,用户自行从接口中获取列表数据并处理,将处理好的列表数据传入此方法中导出为 Excel。

js
function action(ctx) {
  ctx.injected.exportToExcel(option);
}

option 为对象参数如下:

js
{
  data: Array,  // 要导出为Excel的列表数据
  columns: ColumnConfig, // Excel列名配置
  fileName: String // 导出的文件名
}
ColumnConfig:
{
  name: String, // 数据字段名称
  title: String // 数据字段标题
}

示例如下:

js
ctx.injected.exportToExcel({
  data: [
    {
      loginName: "xxx",
      userName: "yyy",
    },
  ],
  columns: [
    {
      name: "userName",
      title: "用户名",
    },
    {
      name: "loginName",
      title: "账号",
    },
  ],
  fileName: "用户信息",
});

设置cookie属性值 setCookie

该方法用于设置cookie属性值

js
function action(ctx) {
  ctx.injected.setCookie(name, value, expires);
}

name设置到cookie属性的名 value设置到cookie属性的值 expires设置该属性的过期时间,类型是number则表示过期天数,类型是Date则表示过期的时间戳,不传该参数则表示不设置过期时间

获取cookie属性值 getCookie

该方法用于获取cookie属性值

js
function action(ctx) {
  ctx.injected.getCookie(name);
}

name要获取的cookie属性的名

全局提示(仅用于移动端) showToast

该方法用于全局提示信息

js
function action(ctx) {
  ctx.injected.showToast({
    type: "text" | "loading" | "success" | "fail", // 提示类型
    message: "内容", // 提示内容
    duration: 2000, // 展示时长(ms),值为 0 时,toast 不会消失
  });
}

关闭全局提示(仅用于移动端) closeToast

该方法用于关闭全局提示信息

js
function action(ctx) {
  ctx.injected.closeToast();
}