$app

概述#

通过 $app ，您可以拿到当前应用的数据和常见的工具库、可以调用云函数、可以直接在低码编辑器中直接使用 $app 等，增加编写程序的扩展性、便利性。

交互#

showToast(param: Object)#

入参 Object 属性#

属性	类型	默认值	必填	说明
title	title		是	提示的内容
icon	string	'success'	否	图标
image	string		否	自定义图标的本地路径或 url ，image 的优先级高于 icon
duration	number	1500	否	提示的延迟时间（毫秒）

object.icon 的合法值#

值	说明
success	显示成功图标，此时 title 文本最多显示 7 个汉字长度
error	显示失败图标，此时 title 文本最多显示 7 个汉字长度
loading	显示加载图标，此时 title 文本最多显示 7 个汉字长度
none	不显示图标，此时 title 文本最多可显示两行，1.9.0 及以上版本支持

示例#

$app.showToast({  title: "成功",  icon: "success",  duration: 2000 // 2秒});

$app.showToast({  title: "失败",  icon: "error",  duration: 2000 // 2秒});

showLoading(object: Object)#

显示 loading 提示框。需主动调用 $app.hideLoading 才能关闭提示框。

Object 参数#

属性	类型	默认值	必填	说明
title	string		false	提示的内容

示例#

$app.showLoading({  title: "加载中"});

hideLoading(object:Object)#

隐藏 loading 提示框。需主动调用 $app.hideLoading 才能关闭提示框。

showModal(object: Object)#

显示模态对话框。

object 参数#

属性	类型	默认值	必填	说明
title	string		否	提示的标题
content	string		否	提示的内容
showCancel	boolean	true	否	是否显示取消按钮
cancelText	string	'取消'	否	取消按钮的文字，最多 4 个字符
cancelColor	string	#000000	否	取消按钮的文字颜色，必须是 16 进制格式的颜色字符串
confirmText	string	'确定'	否	确认按钮的文字，最多 4 个字符
confirmColor	string	#576B95	否	确认按钮的文字颜色，必须是 16 进制格式的颜色字符串
success	function		否	接口调用成功的回调函数
fail	function		否	接口调用失败的回调函数
complete	function		否	接口调用结束的回调函数（调用成功、失败都会执行）

object.success 回调函数#

属性	类型	说明
content	string	editable 为 true 时，用户输入的文本
confirm	boolean	为 true 时，表示用户点击了确定按钮
cancel	boolean	为 true 时，表示用户点击了取消

示例#

$app.showModal({  title: "提示",  content: "这是一个模态弹窗",  success(res) {    if (res.confirm) {      console.log("用户点击确定");    } else if (res.cancel) {      console.log("用户点击取消");    }  }});

工具#

utils.formatDate(date, mask, utc, gmt)#

描述：格式化日期函数，能够按照特定的格式将时间戳格式化。

输入参数#

参数	类型	必填	说明
date	timestamp	是	时间戳（毫秒级别）
mask	string	是	日期的格式

示例#

let currentDate;
currentDate = $app.utils.formatDate(Date.now(), "ddd mmm dd yyyy HH:MM:ss");console.log(currentDate);// 结果：Fri May 28 2021 11:20:45
currentDate = $app.utils.formatDate(Date.now(), "yyyy年mm月dd日 HH时MM分ss秒");console.log(currentDate);// 结果：2021年05月28日 11时20分45秒
currentDate = $app.utils.formatDate(1622172155227, "yy年mm月dd日 HH时MM分ss秒", false, false);console.log(currentDate);// 结果：21年05月28日 11时22分35秒
currentDate = $app.utils.formatDate(1622172155227, "yy年mm月dd日 HH时MM分ss秒", true);console.log(currentDate);// 结果：21年05月28日 03时22分35秒

Mask 示例#

Mask	结果
`ddd mmm dd yyyy HH:MM:ss`	Sat Jun 09 2007 17:46:21
`m/d/yy`	6/9/07
`mm/dd/yyyy`	06/09/2007
`mmm d, yyyy`	Jun 9, 2007
`mmmm d, yyyy`	June 9, 2007
`dddd, mmmm d, yyyy`	Saturday, June 9, 2007
`h:MM TT`	5:46 PM
`h:MM:ss TT`	5:46:21 PM
`h:MM:ss TT Z`	5:46:21 PM EST
`yyyy-mm-dd`	2007-06-09
`HH:MM:ss`	17:46:21
`yyyy-mm-dd'T'HH:MM:sso`	2007-06-09T17:46:21+0700
`UTC:yyyy-mm-dd'T'HH:MM:ss'Z'`	2007-06-09T22:46:21Z

$app.setState(object)#

描述：设置 $app.dataset.state 的值，会根据传入 object 的 key 作为路径，按 key 顺序将$app.dataset.state 中对应路径的值设置为 object 的 value 。没有的属性将会创建，不会对其他属性做修改。

传入参数#

参数	类型	必填	说明
object	object	是	以路径作为 key，新值作为 value 的 object

示例#

/*$app.dataset.state 初始值{t: 1};*/$app.setState({  "a.b": 0, // 路径指向相同属性的情况下前面的值会被后面的值覆盖  "a.b": 1,  b: true,  c: { a: 1 },  "c.a": 2,  d: {    e: 1  }});
/*$app.dataset.state 新值{    a: {        b: 1    },    b: true,    c: {      a: 2    },    d: {      e: 1    },    t: 1}*/

路由#

Tips：请注意，在低码 IDE 中使用该路由函数时，不生效，需要预览或发布才有效果。

navigateTo(object)#

保留当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面。

参数属性#

属性	类型	默认值	必填	说明
pageId	string	''	是	页面 id
packageName	string	''	否	子应用包地址，例如 packages/subapp
params	object	{}	否	query object 对象

示例代码#

$app.navigateTo({  pageId: "index", // 页面 Id  params: { key: "value" }});

redirectTo(object)#

关闭当前页面，跳转到应用内的某个页面。

参数属性#

属性	类型	默认值	必填	说明
pageId	string	''	是	页面 id
packageName	string	''	否	子应用名称
params	object	{}	否	query object 对象

示例代码#

$app.redirectTo({  pageId: "home", // 页面 Id  packageName: "", // 主应用为空或不填，子模块填写 子包目录，查找位置 子包编辑器 --- 页面 --- 子包目录  params: { key: "value" }});

reLaunch(object)#

关闭所有页面，打开到应用内的某个页面（因浏览器限制，web下能后退页面）

参数属性#

属性	类型	默认值	必填	说明
pageId	string	''	是	页面 id
packageName	string	''	否	子应用名称
params	object	{}	否	query object 对象

示例代码#

$app.reLaunch({  pageId: "home", // 页面 Id  packageName: "", // 主应用为空或不填，子模块填写 子包目录，查找位置 子包编辑器 --- 页面 --- 子包目录  params: {}});

navigateBack(object)#

关闭当前页面，返回上一页面或多级页面。

参数属性#

属性	类型	默认值	必填	说明
delta	number	1	否	返回的页面数，如果 delta 大于现有页面数，则返回到首页。

示例代码#

$app.navigateBack();

数据源#

cloud.callDataSource(Object)#

调用数据源的方法，异步 promise 形式。

入参属性#

属性	类型	默认值	必填	说明
dataSourceName	String	-	是	数据源标识
methodName	String	-	是	数据源方法标识
params	Object	-	否	数据源方法参数

let data = await $app.cloud.callDataSource({  dataSourceName: "logUser",  methodName: "getItem",  params: {    _id: "xxxx"  }});// data 为数据源方法云函数返回值

云函数#

在微搭中，云函数建立在数据源之下，只有当应用绑定了某个数据源，才能调用到该数据源以下的云函数。

以示例引用为例，假设当前应用绑定了 logUser 数据源。

logUser数据源

数据源包含 create, delete, update, getitem, getList 五个云函数。

云函数

则可以在页面的生命周期调用云函数。

async onPageLoad(query) {    let res = await $app.cloud.callDataSource({      dataSourceName: "logUser",      methodName: "create",      params: {        name: 'Jack',        email: 'example@qq.com'      }    })    console.log(res)},

平台#

platform#

获取当前平台

示例#

console.log($app.platform);// web端输出 WEB，小程序端输出 MINIPROGRAME

用户信息#

auth.getUserInfo/auth.currentUser#

获取当前登录的用户信息。推荐使用 auth.getUserInfo 实时获取

出参Object属性#

属性	类型	说明
name	string	用户名称
nickName	string	用户昵称
type	number	类型。0:内部用户; 1:外部用户; 2:匿名用户
email	string	邮箱
phone	string	手机
relatedRoles	array	该用户关联的角色。具体字段见下面解释
openId	string	微信openid/企业微信openid
userId	string	微搭用户id
mainOrg	object	主岗部门
orgs	array	兼岗部门

出参object.relatedRoles[i]属性#

属性	类型	说明
id	string	角色id
envId	string	环境ID
name	string	角色名称
roleIdentity	string	角色标识

出参object.mainOrg属性#

属性	类型	说明
id	string	主岗部门id
name	string	主岗部门名称

出参object.orgs[i]属性#

属性	类型	说明
id	string	兼岗部门id
name	string	兼岗部门名称

示例#

const userInfo = await $app.auth.getUserInfo();console.log('$app.auth.getUserInfo:', userInfo);
console.log('$app.auth.currentUser:', $app.auth.currentUser);/** * { *   name: "xxx", *   openId: "xxx", *   relatedRoles: [{envId: "lowcode-xxx", id: "xxx",name: "xxx", roleIdentity: "xxx"}], *   type: 1, *   phone: "xxx", *   email: "", *   userId: "xxx", *   mainOrg: {id: "xxx", name: "xxx"}, *   orgs: [{id: "xxx", name: "xxx"}] * } * /