您可以通过在动作面板中对函数进行调用,即可快速实现对应功能。本文介绍页面和页面框架的动作面板中的内置函数。
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;
}