$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 数据源。
数据源包含 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:匿名用户 |
| 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"}] * } * /组件方法#
invoke(param: Object)#
入参 Object 属性#
| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| component | string | 是 | 组件id | |
| method | string | 是 | 组件方法标识 | |
| params | object | 否 | 传入组件方法的参数 |
示例#
$app.invoke({component: 'id66', method: 'open', params: {}})