小程序常用API集合

小程序常用API集合

1. 存储，获取，删除，应用程序的数据具体文档

uni.setStorageSync('info', '你好呀')
uni.getStorageSync('info')  // 你好呀
uni.removeStorageSync('info');
1
2
3

3. 异步获取系统信息 返回的信息特别多具体参数详情

uni.getSystemInfo({
	success: e => {
		console.log(e)
	}
})
1
2
3
4
5

4. 用于获取小程序下该菜单按钮的布局位置信息详细文档

uni.getMenuButtonBoundingClientRect()
1

5. uni.login是一个客户端API，统一封装了各个平台的各种常见的登录方式，包括App手机号一键登陆、三方登录（微信、微博、QQ、Apple、google、facebook）、各家小程序内置登录具体文档

uni.login({
  	success: loginRes => {
       
  	}
  })
1
2
3
4
5

6. 隐藏 tabBar具体文档

uni.hideTabBar()
1

7. 添加拦截器具体文档

uni.addInterceptor(item, { //监听跳转
	invoke(e) {
		console.log(e)
	}
})
1
2
3
4
5

8. 显示消息提示框具体文档

   uni.showToast({
     title:'加载成功',
        icon:'none'
    })
1
2
3
4

9. 使手机发生较短时间的振动（15ms）具体文档

uni.vibrateShort();
1

10. 获取当前的地理位置、速度。具体文档

uni.getLocation({
   type: 'wgs84',
   success: (res) => {

   },
   fail: (res) => {

   }
 });
1
2
3
4
5
6
7
8
9

11. 提前向用户发起授权请求。调用后会立刻弹窗询问用户是否同意授权小程序使用某项功能或获取用户的某些数据，但不会实际调用对应接口。如果用户之前已经同意授权，则不会出现弹窗，直接返回成功。如果用户之前拒绝了授权，此接口会直接进入失败回调，一般搭配uni.getSetting和uni.openSetting使用。具体文档

 uni.authorize({
   scope: 'scope.record',
   success() {
     // 用户已经同意小程序使用录音功能，后续调用 wx.startRecord 接口不会弹窗询问
   },
   fail(){
  
     
   }
 })
1
2
3
4
5
6
7
8
9
10

12. 显示模态弹窗，可以只有一个确定按钮，也可以同时有确定和取消按钮。类似于一个API整合了 html 中：alert、confirm。具体文档

uni.showModal({
  title: '提示',
  content: '您未授权录音，功能将无法使用',
  showCancel: true,
  confirmText: "授权",
  confirmColor: "#52a2d8",
  success: function (res1) {
  
  },
  fail: function () {

  }
})

1
2
3
4
5
6
7
8
9
10
11
12
13
14

13. 获取用户的当前设置具体文档

 uni.getSetting({
   success(res) {
     console.log(res)
   }
  })
1
2
3
4
5

14. 返回一个 SelectorQuery 对象实例。可以在这个实例上使用 select 等方法选择节点，并使用 boundingClientRect 等方法选择需要查询的信息。具体文档

uni.createSelectorQuery().in(this).select('#canvas')
1

15. 创建 canvas 绘图上下文（指定 canvasId）。在自定义组件下，第二个参数传入组件实例this，以操作组件内 组件具体文档

uni.createCanvasContext('#canvas', this)
1

16. 把当前画布指定区域的内容导出生成指定大小的图片，并返回文件路径。在自定义组件下，第二个参数传入自定义组件实例，以操作组件内 组件。具体文档

uni.canvasToTempFilePath(copyArgs, this)
1

17. 将 Base64 字符串转成 ArrayBuffer 对象具体文档

uni.base64ToArrayBuffer(data)
1

18. 获取图片信息。
    小程序下获取网络图片信息需先配置download域名白名单才能生效。具体文档

uni.getImageInfo({
	src: img,
	success: (image) => {

	},
	fail(err) {

	}
})
1
2
3
4
5
6
7
8
9

19. 将upx单位值转换成px。因upx已废弃，推荐使用rpx。具体文档

uni.upx2px()
1

20. 将页面滚动到目标位置。可以指定滚动到具体的scrollTop数值，也可以指定滚动到某个元素的位置具体文档

uni.pageScrollTo({
	scrollTop: top,
    duration: t
})
1
2
3
4

21. 下拉刷新具体文档

	uni.startPullDownRefresh();
1

22. 动态设置当前页面的标题具体文档

	uni.setNavigationBarTitle({
		title: '设置标题'
	})
1
2
3

23. 预览图片具体文档

uni.previewImage({
	current: this.i,
	urls: 'https://xxxxx.com'
});
1
2
3
4

24. 微信小程序跳转小程序（半屏模式）（从微信础库 2.20.1 开始支持）

当小程序需要打开另一个小程序让用户进行快捷操作时，可将要打开的小程序以半屏的形态跳转。具体文档

uni.openEmbeddedMiniProgram({
	appId: attrs['app-id'],
	path: attrs.path
})
1
2
3
4

25. 设置系统剪贴板的内容具体文档

uni.setClipboardData({
	data: 'https://xxxxxx.com',
	success: () =>
		uni.showToast({
			title: '链接已复制'
		})
})
1
2
3
4
5
6
7

26. 自定义事件详细文档

uni.report(item.text, item.text)
1

27. 设置页面导航条颜色。如果需要进入页面就设置颜色，请延迟执行，防止被框架内设置颜色逻辑覆盖具体文档

	uni.setNavigationBarColor({
		frontColor: '#333',
		backgroundColor: "#FFFFFF"
	});
1
2
3
4

28. 显示 loading 提示框, 需主动调用 uni.hideLoading 才能关闭提示框具体文档

uni.showLoading({
	title: '海报生成中',
	mask: true, // 是否显示遮罩层，默认为true
	// 自定义样式，可以设置透明度
	style: 'background-color: rgba(0, 0, 0, 0.1);' // 透明度为0.5的黑色遮罩层
});
// 关闭loading
uni.hideLoading()
1
2
3
4
5
6
7
8

29. 获取全局唯一的文件管理器

uni.getFileSystemManager()
1

30. 将本地资源上传到开发者服务器，客户端发起一个 POST 请求，其中 content-type 为 multipart/form-data。 如页面通过 uni.chooseImage 等接口获取到一个本地资源的临时文件路径后，可通过此接口将本地资源上传到指定服务器具体文档

uni.uploadFile({
 url: getApp().globalData.requestUrl+'base/common/file/noLimitUpload', //仅为示例，非真实的接口地址
 filePath: val,
 name: 'file',
 formData: {
   'file': res.data
 },
 success: (uploadFileRes) => {
    console.log(uploadFileRes,'uploadFileResuploadFileRes')
 }
});
1
2
3
4
5
6
7
8
9
10
11

31. 获取系统信息的同步接口具体文档

uni.getSystemInfoSync()
1

32. 拨打电话具体文档

 uni.makePhoneCall({
     phoneNumber: phone
   });
1
2
3

33. 支付具体文档

uni.requestPayment({
    // #ifdef MP-WEIXIN
    timeStamp: res.data.timeStamp,
    nonceStr: res.data.nonceStr,
    package: `prepay_id=${res.data.prepayid}`,
    signType: res.data.signType,
    paySign: res.data.pay_sign,
    // #endif
    // #ifdef MP-ALIPAY
    	orderInfo: res.data.tradeNo,
    // #endif
    success: success => {
			console.log('success:' + JSON.stringify(success))
    },
    fail: err => {
			console.log('fail:' + JSON.stringify(err))
    }
});
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

34. 从底部向上弹出操作菜单具体文档

uni.showActionSheet({
	itemList: ['退货', '换货'],
	success: res => {
	   console.log(res);  
	},
	fail: res => {
		console.log(res.errMsg);
	}
});
1
2
3
4
5
6
7
8
9

35. 在当前页面显示导航条加载动画。具体文档

uni.showNavigationBarLoading()
uni.hideNavigationBarLoading()
1
2

36. 下载文件资源到本地，客户端直接发起一个 HTTP GET 请求，返回文件的本地临时路径。具体文档

uni.downloadFile({
   url,
   success: (e) => {
    console.log(e)
   },
   fail: (r) => {
     console.log(r)
   }
 })
1
2
3
4
5
6
7
8
9

37. 创建并返回内部 audio 上下文 innerAudioContext 对象。具体文档

uni.createInnerAudioContext()
1

38. 消息订阅，用户发生点击行为或者发起支付回调后，才可以调起订阅消息界面具体文档

uni.requestSubscribeMessage({
	tmplIds:['vaaW2n2qCr5GeEy29ndpGgf02U0Ahbd012RdA45Z90A'], // 需要订阅的消息模板的id的集合
	success(res){
		console.log(e)
	},
	fail(res){
		console.log(res)
	}
})
1
2
3
4
5
6
7
8
9

39. 保存图片到系统相册。具体文档

uni.saveImageToPhotosAlbum({
		filePath: wx.env.USER_DATA_PATH + '/imageName.png',
		success: function(res) {
		
		},
		fail: function() {
	
		}
	})
1
2
3
4
5
6
7
8
9

40. 引入 App 原生语言插件具体文档

uni.requireNativePlugin('animation')
1

41. 创建并返回 map 上下文 mapContext 对象。在自定义组件下，第二个参数传入组件实例this，以操作组件内

uni.createMapContext("map", this)
1

42. 网页向应用发送消息，在 的 message 事件回调 event.detail.data 中接收消息具体文档

uni.postMessage({
	data
});
1
2
3

43. 收起键盘具体文档

uni.hideKeyboard()
1