uni-app
的 js API 由标准 ECMAScript 的 js API 和 uni 扩展 API 这两部分组成。
标准 ECMAScript 的 js 仅是最基础的 js。浏览器基于它扩展了 window、document、navigator 等对象。小程序也基于标准 js 扩展了各种 wx.xx、my.xx、swan.xx 的 API。node 也扩展了 fs 等模块。
uni-app 基于 ECMAScript 扩展了 uni 对象,并且 API 命名与小程序保持兼容。
uni-app
的 js 代码,h5 端运行于浏览器中。非 h5 端(包含小程序和 App),Android 平台运行在 v8 引擎中,iOS 平台运行在 iOS 自带的 jscore 引擎中,都没有运行在浏览器或 webview 里。
非 H5 端,虽然不支持 window、document、navigator 等浏览器的 js API,但也支持标准 ECMAScript。
请注意不要把浏览器里的 js 扩展对象等价于标准 js。
所以 uni-app 的非 H5 端,一样支持标准 js,支持 if、for 等语法,支持字符串、数字、时间、布尔值、数组、自定义对象等变量类型及各种处理方法。仅仅是不支持 window、document、navigator 等浏览器专用对象。
除了 uni-app 框架内置的跨端 API,各端自己的特色 API 也可通过条件编译自由使用。
各端特色 API 规范参考各端的开发文档。其中 App 端的 JS API 参考html5plus.org (opens new window);uni-app 也支持通过扩展原生插件来丰富 App 端的开发能力,具体参考插件开发文档 (opens new window)
各平台的 API 新增,不需要 uni-app 升级,开发者就可以直接使用。
Promise 化
具体 API Promise 化
的策略:
异步的方法,如果不传入 success、fail、complete 等 callback 参数,将以 Promise 返回数据。例如:uni.getImageInfo()
异步的方法,且有返回对象,如果希望获取返回对象,必须至少传入一项 success、fail、complete 等 callback 参数。例如:
// 正常使用
const task = uni.connectSocket(
success(res){
console.log(res)
}
)
// Promise 化
uni.connectSocket().then(res => {
// 此处即为正常使用时 success 回调的 res
// uni.connectSocket() 正常使用时是会返回 task 对象的,如果想获取 task ,则不要使用 Promise 化
console.log(res)
})
不进行 Promise 化
的 API:
uni.getSystemInfoSync()
uni.createMapContext()
uni.getBackgroundAudioManager()
Promise 化
Vue 2 和 Vue 3 项目中
API Promise 化
返回格式不一致,以下为不同点
和返回格式互相转换
不同点
catch
是拿不到报错信息的,因为内部对错误进行了拦截。then 方法
回调。调用失败会进入 catch 方法
回调使用示例:
Vue2
Vue 3
// 默认方式
uni.request({
url: "https://www.example.com/request",
success: (res) => {
console.log(res.data);
},
fail: (err) => {
console.error(err);
},
});
// Promise
uni
.request({
url: "https://www.example.com/request",
})
.then((data) => {
// data为一个数组
// 数组第一项为错误信息 即为 fail 回调
// 第二项为返回数据
var [err, res] = data;
console.log(res.data);
});
// Await
async function request() {
var [err, res] = await uni.request({
url: "https://www.example.com/request",
});
console.log(res.data);
}
返回格式互相转换
Vue2
Vue3
// Vue 2 转 Vue 3, 在 main.js 中写入以下代码即可
function isPromise(obj) {
return (
!!obj &&
(typeof obj === "object" || typeof obj === "function") &&
typeof obj.then === "function"
);
}
uni.addInterceptor({
returnValue(res) {
if (!isPromise(res)) {
return res;
}
return new Promise((resolve, reject) => {
res.then((res) => {
if (res[0]) {
reject(res[0]);
} else {
resolve(res[1]);
}
});
});
},
});
API | 说明 |
---|---|
日志打印 | 向控制台打印日志信息 |
定时器 | 在定时到期以后执行注册的回调函数 |
uni.base64ToArrayBuffer | 将 Base64 字符串转成 ArrayBuffer 对象 |
uni.arrayBufferToBase64 | 将 ArrayBuffer 对象转成 Base64 字符串 |
应用级事件 | 监听应用事件 |
拦截器 | 拦截 Api 等调用并执行回调 |
全局 API | 可全局调用 Api |
API | 说明 |
---|---|
uni.request | 发起网络请求 |
API | 说明 |
---|---|
uni.uploadFile | 上传文件 |
uni.downloadFile | 下载文件 |
API | 说明 |
---|---|
uni.connectSocket | 创建 WebSocket 连接 |
uni.onSocketOpen | 监听 WebSocket 打开 |
uni.onSocketError | 监听 WebSocket 错误 |
uni.sendSocketMessage | 发送 WebSocket 消息 |
uni.onSocketMessage | 接受 WebSocket 消息 |
uni.closeSocket | 关闭 WebSocket 连接 |
uni.onSocketClose | 监听 WebSocket 关闭 |
API | 说明 |
---|---|
SocketTask.send | 通过 WebSocket 连接发送数据 |
SocketTask.close | 关闭 WebSocket 连接 |
SocketTask.onOpen | 监听 WebSocket 连接打开事件 |
SocketTask.onClose | 监听 WebSocket 连接关闭事件 |
SocketTask.onError | 监听 WebSocket 错误事件 |
SocketTask.onMessage | 监听 WebSocket 接受到服务器的消息事件 |
API | 说明 |
---|---|
uni.chooseImage | 从相册选择图片,或者拍照 |
uni.previewImage | 预览图片 |
uni.closePreviewImage | 关闭预览图片 |
uni.getImageInfo | 获取图片信息 |
uni.saveImageToPhotosAlbum | 保存图片到系统相册 |
API | 说明 |
---|---|
uni.chooseFile | 从本地选择文件 |
API | 说明 |
---|---|
uni.getRecorderManager | 录音管理 |
API | 说明 |
---|---|
uni.getBackgroundAudioManager | 背景音频播放管理 |
API | 说明 |
---|---|
uni.createInnerAudioContext | 音频组件管理 |
API | 说明 |
---|---|
uni.chooseVideo | 从相册选择视频,或者拍摄 |
uni.chooseMedia | 拍摄或从手机相册中选择图片或视频。 |
uni.saveVideoToPhotosAlbum | 保存视频到系统相册 |
uni.createVideoContext | 视频组件管理 |
API | 说明 |
---|---|
uni.createCameraContext | 相机组件管理 |
API | 说明 |
---|---|
uni.createLivePlayerContext | 直播组件管理 |
API | 说明 |
---|---|
uni.saveFile | 保存文件 |
uni.getSavedFileList | 获取已保存的文件列表 |
uni.getSavedFileInfo | 获取已保存的文件信息 |
uni.removeSavedFile | 删除已保存的文件信息 |
uni.getFileInfo | 获取文件信息 |
uni.openDocument | 打开文件 |
API | 说明 |
---|---|
uni.getStorage | 获取本地数据缓存 |
uni.getStorageSync | 获取本地数据缓存 |
uni.setStorage | 设置本地数据缓存 |
uni.setStorageSync | 设置本地数据缓存 |
uni.getStorageInfo | 获取本地缓存的相关信息 |
uni.getStorageInfoSync | 获取本地缓存的相关信息 |
uni.removeStorage | 删除本地缓存内容 |
uni.removeStorageSync | 删除本地缓存内容 |
uni.clearStorage | 清理本地数据缓存 |
uni.clearStorageSync | 清理本地数据缓存 |
API | 说明 |
---|---|
uni.getLocation | 获取当前位置 |
uni.chooseLocation | 打开地图选择位置 |
API | 说明 |
---|---|
uni.openLocation | 打开内置地图 |
API | 说明 |
---|---|
uni.createMapContext | 地图组件控制 |
API | 说明 |
---|---|
uni.getSystemInfo | 获取系统信息 |
uni.getSystemInfoSync | 获取系统信息 |
uni.canIUse | 判断应用的 API,回调,参数,组件等是否在当前版本可用 |
API | 说明 |
---|---|
uni.onMemoryWarning | 监听内存不足告警事件 |
API | 说明 |
---|---|
uni.getNetworkType | 获取网络类型 |
uni.onNetworkStatusChange | 监听网络状态变化 |
uni.offNetworkStatusChange | 取消监听网络状态变化 |
API | 说明 |
---|---|
uni.onAccelerometerChange | 监听加速度数据 |
uni.offAccelerometerChange | 取消监听加速度数据 |
uni.startAccelerometer | 开始监听加速度数据 |
uni.stopAccelerometer | 停止监听加速度数据 |
API | 说明 |
---|---|
uni.onCompassChange | 监听罗盘数据 |
uni.offCompassChange | 取消监听罗盘数据 |
uni.startCompass | 开始监听罗盘数据 |
uni.stopCompass | 停止监听罗盘数据 |
API | 说明 |
---|---|
uni.onGyroscopeChange | 监听陀螺仪数据 |
uni.startGyroscope | 开始监听陀螺仪数据 |
uni.stopGyroscope | 停止监听陀螺仪数据 |
API | 说明 |
---|---|
uni.makePhoneCall | 拨打电话 |
API | 说明 |
---|---|
uni.scanCode | 扫码 |
API | 说明 |
---|---|
uni.setClipboardData | 设置剪贴板内容 |
uni.getClipboardData | 获取剪贴板内容 |
API | 说明 |
---|---|
uni.setScreenBrightness | 设置屏幕亮度 |
uni.getScreenBrightness | 获取屏幕亮度 |
uni.setKeepScreenOn | 设置是否保持常亮状态 |
API | 说明 |
---|---|
uni.onUserCaptureScreen | 监听用户截屏事件 |
API | 说明 |
---|---|
uni.vibrate | 使手机发生振动 |
uni.vibrateLong | 使手机发生较长时间的振动 |
uni.vibrateShort | 使手机发生较短时间的振动 |
API | 说明 |
---|---|
uni.addPhoneContact | 添加手机通讯录 |
API | 说明 |
---|---|
uni.openBluetoothAdapter | 初始化蓝牙模块 |
uni.startBluetoothDevicesDiscovery | 搜寻附近的蓝牙外围设备 |
uni.onBluetoothDeviceFound | 监听寻找到新设备的事件 |
uni.stopBluetoothDevicesDiscovery | 停止搜寻 |
uni.onBluetoothAdapterStateChange | 监听蓝牙适配器状态变化事件 |
uni.getConnectedBluetoothDevices | 根据 uuid 获取处于已连接状态的设备 |
uni.getBluetoothDevices | 获取已发现的蓝牙设备 |
uni.getBluetoothAdapterState | 获取本机蓝牙适配器状态 |
uni.closeBluetoothAdapter | 关闭蓝牙模块 |
API | 说明 |
---|---|
uni.writeBLECharacteristicValue | 向低功耗蓝牙设备特征值中写入二进制数据 |
uni.readBLECharacteristicValue | 读取低功耗蓝牙设备的特征值的二进制数据值 |
uni.onBLEConnectionStateChange | 监听低功耗蓝牙连接状态的改变事件 |
uni.onBLECharacteristicValueChange | 监听低功耗蓝牙设备的特征值变化事件 |
uni.notifyBLECharacteristicValueChange | 启用蓝牙低功耗设备特征值变化时的 notify 功能,订阅特征 |
uni.getBLEDeviceServices | 获取蓝牙设备所有服务(service) |
uni.getBLEDeviceCharacteristics | 获取蓝牙设备某个服务中所有特征值(characteristic) |
uni.createBLEConnection | 连接低功耗蓝牙设备 |
uni.closeBLEConnection | 断开与低功耗蓝牙设备的连接 |
API | 说明 |
---|---|
uni.onBeaconServiceChange | 监听 iBeacon 服务状态变化事件 |
uni.onBeaconUpdate | 监听 iBeacon 设备更新事件 |
uni.getBeacons | 获取所有已搜索到的 iBeacon 设备 |
uni.startBeaconDiscovery | 停止搜索附近的 iBeacon 设备 |
uni.stopBeaconDiscovery | 开始搜索附近的 iBeacon 设备 |
API | 说明 |
---|---|
uni.startSoterAuthentication | 开始生物认证 |
uni.checkIsSupportSoterAuthentication | 获取本机支持的生物认证方式 |
uni.checkIsSoterEnrolledInDevice | 获取设备内是否录入如指纹等生物信息的接口 |
API | 说明 |
---|---|
uni.showToast | 显示提示框 |
uni.showLoading | 显示加载提示框 |
uni.hideToast | 隐藏提示框 |
uni.hideLoading | 隐藏加载提示框 |
uni.showModal | 显示模态弹窗 |
uni.showActionSheet | 显示菜单列表 |
API | 说明 |
---|---|
uni.setNavigationBarTitle | 设置当前页面标题 |
uni.setNavigationBarColor | 设置页面导航条颜色 |
uni.showNavigationBarLoading | 显示导航条加载动画 |
uni.hideNavigationBarLoading | 隐藏导航条加载动画 |
API | 说明 |
---|---|
uni.setTabBarItem | 动态设置 tabBar 某一项的内容 |
uni.setTabBarStyle | 动态设置 tabBar 的整体样式 |
uni.hideTabBar | 隐藏 tabBar |
uni.showTabBar | 显示 tabBar |
uni.setTabBarBadge | 为 tabBar 某一项的右上角添加文本 |
uni.removeTabBarBadge | 移除 tabBar 某一项右上角的文本 |
uni.showTabBarRedDot | 显示 tabBar 某一项的右上角的红点 |
uni.hideTabBarRedDot | 隐藏 tabBar 某一项的右上角的红点 |
API | 说明 |
---|---|
uni.setBackgroundColor | 动态设置窗口的背景色。 |
uni.setBackgroundTextStyle | 动态设置下拉背景字体、loading 图的样式。 |
API | 说明 |
---|---|
uni.createAnimation | 创建一个动画实例 animation。调用实例的方法来描述动画。最后通过动画实例的 export 方法导出动画数据传递给组件的 animation 属性。 |
API | 说明 |
---|---|
uni.pageScrollTo | 将页面滚动到目标位置。 |
API | 说明 |
---|---|
uni.createCanvasContext | 创建绘图上下文 |
uni.canvasToTempFilePath | 将画布内容保存成文件 |
uni.canvasGetImageData | 获取画布图像数据 |
uni.canvasPutImageData | 设置画布图像数据 |
API | 说明 |
---|---|
onPullDownRefresh | 监听该页面用户下拉刷新事件 |
uni.startPullDownRefresh | 开始下拉刷新 |
uni.stopPullDownRefresh | 停止当前页面下拉刷新 |
API | 说明 |
---|---|
uni.createSelectorQuery | 创建查询请求 |
selectorQuery.select | 根据选择器选择单个节点 |
selectorQuery.selectAll | 根据选择器选择全部节点 |
selectorQuery.selectViewport | 选择显示区域 |
selectorQuery.exec | 执行查询请求 |
nodesRef.boundingClientRect | 获取布局位置和尺寸 |
nodesRef.scrollOffset | 获取滚动位置 |
nodesRef.fields | 获取任意字段 |
API | 说明 |
---|---|
uni.createIntersectionObserver | 创建 IntersectionObserver 对象 |
intersectionObserver.relativeTo | 指定参照节点 |
intersectionObserver.relativeToViewport | 指定页面显示区域作为参照区域 |
intersectionObserver.observe | 指定目标节点并开始监听 |
intersectionObserver.disconnect | 停止监听 |
API | 说明 |
---|---|
uni.navigateTo | 保留当前页面,跳转到应用内的某个页面,使用 uni.navigateBack 可以返回到原页面 |
uni.redirectTo | 关闭当前页面,跳转到应用内的某个页面 |
uni.reLaunch | 关闭所有页面,打开到应用内的某个页面 |
uni.switchTab | 跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面 |
uni.navigateBack | 关闭当前页面,返回上一页面或多级页面 |
API | 说明 |
---|---|
uni.hideKeyboard | 隐藏已经显示的软键盘,如果软键盘没有显示则不做任何操作。 |
uni.onKeyboardHeightChange | 监听键盘高度变化 |
uni.offKeyboardHeightChange | 取消监听键盘高度变化事件 |
uni.getSelectedTextRange | 在input、textarea等focus之后,获取输入框的光标位置 |
API | 说明 |
---|---|
uni.getProvider | 获取服务供应商 |
uni.login | 登录 |
uni.getUserInfo | 获取用户信息 |
uni.getuserprofile | 获取用户信息。每次请求都会弹出授权窗口,用户同意后返回 userInfo |
uni.checkSession | 检查登录状态是否过期 |
uni.preLogin | 预登录 |
uni.closeAuthView | 关闭一键登录页面 |
uni.getCheckBoxState | 获取一键登录条款勾选框状态 |
uni.getUniverifyManager | 获取全局唯一的一键登录管理器 univerifyManager |
uni.share | 分享 |
uni.shareWithSystem | 使用系统分享 |
uni.requestPayment | 支付 |
uni.subscribePush | 开启推送 |
uni.unsubscribePush | 关闭推送 |
uni.onPush | 监听透传数据 |
uni.offPush | 移除监听透传数据 |
API | 说明 |
---|---|
激励视频广告 | 激励视频广告,是 cpm 收益最高的广告形式 |
全屏视频广告 | 全屏视频广告 |
内容联盟广告 | 内容联盟广告 |
插屏广告 | 插屏广告 |
互动游戏 | 互动游戏是 DCloud 联合三方服务商为开发者提供新的广告场景增值服务 |
API | 说明 |
---|---|
uni.requireNativePlugin | 引入 App 原生插件 |
API | 说明 |
---|---|
uni.authorize | 提前向用户发起授权请求 |
API | 说明 |
---|---|
uni.openSetting | 调起客户端小程序设置界面,返回用户设置的操作结果。 |
uni.getSetting | 获取用户的当前设置。 |
API | 说明 |
---|---|
uni.chooseAddress | 获取用户收货地址 |
API | 说明 |
---|---|
uni.chooseInvoiceTitle | 选择用户的发票抬头,需要用户授权 scope.invoiceTitle。 |
API | 说明 |
---|---|
uni.navigateToMiniProgram | 打开另一个小程序。 |
uni.navigateBackMiniProgram | 跳转回上一个小程序,只有当另一个小程序跳转到当前小程序时才会能调用成功。 |
API | 说明 |
---|---|
addTemplate | 组合模板并添加至帐号下的个人模板库。 |
deleteTemplate | 删除帐号下的某个模板。 |
getTemplateLibraryById | 获取模板库某个模板标题下关键词库。 |
getTemplateLibraryList | 获取 APP 模板库标题列表 |
getTemplateList | 获取帐号下已存在的模板列表。 |
sendTemplateMessage | 发送模板消息 |
alipay.open.app.mini.templatemessage.send | 支付宝小程序通过 openapi 给用户触达消息,主要为支付后的触达(通过消费 id)和用户提交表单后的触达(通过 formId)。 |
API | 说明 |
---|---|
uni.getUpdateManager | 返回全局唯一的版本更新管理器对象: updateManager,用于管理小程序更新。 |
API | 说明 |
---|---|
uni.setEnableDebug | 设置是否打开调试开关。此开关对正式版也能生效。 |
API | 说明 |
---|---|
uni.getExtConfig | 获取第三方平台自定义的数据字段。 |
uni.getExtConfigSync | uni.getExtConfig 的同步版本。 |