您可以通过在动作面板中对函数进行调用,即可快速实现对应功能。本文介绍页面和页面框架的动作面板中的内置函数。

1、调用后端服务方法

说明
  • 函数在传递参数时,如果传送的是页面设计器内定义的变量,则需要使用内置函数。
  • API及函数参数具体使用方法,请参见Fusion官方文档
/**
* 调用后端服务方法
* @param 后端服务方法编码
* @param 服务方法传参
*/
this.my.invokeFunction("completeWorkflowUserTask", {})

2、快捷调用警告框

/**
* 快捷调用警告对话框
* @param 同Fusion组件的config配置
*/
this.my.alert({
  content: "",
  onOk: () => { },
});

3、快捷调用确认对话框

/**
* 快捷调用确认对话框
* @param 同Fusion组件的config配置
*/
this.my.confirm({
  content: "",
  onOk: () => { },
  onCancel: () => { },
});

4、快捷调用消息弹窗

/**
* 快捷调用消息弹窗
* @param 同Fusion组件的config配置
*/
this.my.showMessage({
  type: 'error',
  title: '错误',
  content: '请联系相关人员反馈!',
  duration: 0, // 永远存在
  hasMask: true
});

5、关闭showMessage产生的弹窗

/**
* 关闭showMessage产生的弹窗
*/
this.my.hideMessage();

6、快捷调用成功消息弹窗

/**
* 快捷调用成功消息弹窗
* @param 同Fusion组件的config配置
*/
this.my.success("demo");

7、快捷调用错误消息弹窗

/**
* 快捷调用错误消息弹窗
* @param 同Fusion组件的config配置
*/
this.my.error("demo");

8、快捷调用加载消息弹窗

/**
* 快捷调用加载消息弹窗
* @param 同Fusion组件的config配置
*/
this.my.loading("demo");

9、打开外部链接

/**
* 打开外部链接
* @param 外部链接地址
* @param 外部链接地址的queryString
*/
this.my.router.openLink("http://www.baidu.com/a=hello", { a: "world", b: "hello" } "self");

10、打开内部页面

/**
* 打开内部页面
* @param 内部页面地址
* @param 内部页面参数
*/
@Deprecated
this.my.router.push("anyUrl", {});

11、push方法的封装版本,打开appPage内部页面

/**
* push方法的封装版本,打开appPage内部页面
* @param pageId
* @param 内部页面参数
*/
this.my.router.openPage("pageId", {});

12、push方法的封装版本,打开simplePage内部页面

/**
* push方法的封装版本,打开simplePage内部页面
* @param pageId
* @param 内部页面参数
*/
this.my.router.openSimplePage("pageId", {});

13、获取当前的URL对象

/**
* 获取当前的Url对象
*/
this.my.router.getLocationUri();

14、getLocationUrl的封装版本,直接获取当前查询字符串的Map

/**
* getLocationUri的封装版本,直接获取当前查询字符串的Map
*/
this.my.router.getUrlQuery();

15、回退到上一个内部页面,等同于点击浏览器左上角退后按钮

/**
* 回退到上一个内部页面,等同于点击浏览器左上角退后按钮
*/
this.my.router.goBack();

16、获取变量

/**
* 获取变量
* @param 变量名
*/
this.my.getVariableValue("varName");

17、设置变量

/**
* 设置变量
* @param 变量名
* @param 变量值
*/
this.my.setVariableValue("varName", 1234);

18、手动设置导航菜单

说明 setNavList的优先级高于自动加载导航菜单,会对其进行覆盖。
/**
* 手动设置导航菜单,注意setNavList的优先级高于自动加载导航菜单,会对其进行覆盖
* @param 导航菜单项,数据结构同yapi的获取导航接口navList返回值
*/
this.my.setNavList([{navType: "menu", menuType: "appPage", targetName: "pageId", displayName: "页面名", icon: "icon-page", children: [], key: "asdasdqwdqwd"}])

19、裸调ajax

/**
* 裸调ajax
* @param 请求地址
* @param 请求配置,同Axios Request Config
*/
this.my.request("/lightAppEngine/metadata/navigation/getNavigation/v1", {method: "post", data: {applicationCode: "qing10"}}).then(res=>console.log(res))

20、对request的post封装

/**
* 对request的post封装
* @param 请求地址
* @param Request Body
* @param 请求配置,同Axios Request Config
*/
this.my.post(url, data?, config?)

21、对request的get封装

/**
* 对request的get封装
* @param 请求地址
* @param Query String
* @param 请求配置,同Axios Request Config
*/
this.my.get(url, params?, config?)

22、表单验证场景的函数示例

// 针对表单验证场景
export function validate() {
  const p = new Promise((resolve, reject) => {
    this.getComponent("表单的唯一标识").validate((errors, values) => {
      if (!_.isEmpty(errors)) {
        reject(errors)
      } else {
        resolve(values);
      }
    })
  })

  p.then((values) => {
    // 校验成功逻辑
  }).catch((errors) => {
    // 校验失败逻辑
  })

  return p;
}