提交 4835f90e 编写于 作者: 雪洛's avatar 雪洛

docs: 5+App --> App

上级 b7793cd0
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
- 答:不是。大量开发者用uni-app只做一个端,详见[案例](https://uniapp.dcloud.io/case)。对于开发者而言,一个优秀工具在手,做什么都不愁。 - 答:不是。大量开发者用uni-app只做一个端,详见[案例](https://uniapp.dcloud.io/case)。对于开发者而言,一个优秀工具在手,做什么都不愁。
- 问:uni-app以后会不会变更开源协议,转向收费? - 问:uni-app以后会不会变更开源协议,转向收费?
- 答:官方承诺永远不会变更开源协议。无论HBuilderX、uni-app、5+app,面向中国人永久免费。 - 答:官方承诺永远不会变更开源协议。无论HBuilderX、uni-app、App,面向中国人永久免费。
## 更多资料 ## 更多资料
......
...@@ -65,7 +65,7 @@ App-nvue下如需使用canvas,暂未封装为uni API,可参考[文档](https ...@@ -65,7 +65,7 @@ App-nvue下如需使用canvas,暂未封装为uni API,可参考[文档](https
在绘制新形状时应用的合成操作的类型。目前安卓版本只适用于 `fill` 填充块的合成,用于 `stroke` 线段的合成效果都是 `source-over` 在绘制新形状时应用的合成操作的类型。目前安卓版本只适用于 `fill` 填充块的合成,用于 `stroke` 线段的合成效果都是 `source-over`
目前支持的操作有 目前支持的操作有
* 5+App和H5端:source-over、destination-over、source-in、destination-in、source-out、destination-out、source-atop、destination-atop、lighter、darker、xor、copy * App和H5端:source-over、destination-over、source-in、destination-in、source-out、destination-out、source-atop、destination-atop、lighter、darker、xor、copy
* 微信小程序安卓端:xor, source-over, source-atop, destination-out, lighter, overlay, darken, lighten, hard-light * 微信小程序安卓端:xor, source-over, source-atop, destination-out, lighter, overlay, darken, lighten, hard-light
* 微信小程序iOS端:xor, source-over, source-atop, destination-over, destination-out, lighter, multiply, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, saturation, luminosity * 微信小程序iOS端:xor, source-over, source-atop, destination-over, destination-out, lighter, multiply, overlay, darken, lighten, color-dodge, color-burn, hard-light, soft-light, difference, exclusion, saturation, luminosity
...@@ -73,7 +73,7 @@ App-nvue下如需使用canvas,暂未封装为uni API,可参考[文档](https ...@@ -73,7 +73,7 @@ App-nvue下如需使用canvas,暂未封装为uni API,可参考[文档](https
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|√| |√|√|√|√|√|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x([CanvasContext.toTempFilePath](https://opendocs.alipay.com/mini/api/rod3ti))|√|√|√| |√|√|√|x([CanvasContext.toTempFilePath](https://opendocs.alipay.com/mini/api/rod3ti))|√|√|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
平台差异说明: 平台差异说明:
* 5+App * App
自 HXuilderX1.4 版本起,``uni-app`` 支持引入原生插件,使用方式如下: 自 HXuilderX1.4 版本起,``uni-app`` 支持引入原生插件,使用方式如下:
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
...@@ -45,7 +45,7 @@ uni.chooseImage({ ...@@ -45,7 +45,7 @@ uni.chooseImage({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
...@@ -87,7 +87,7 @@ uni.getSavedFileList({ ...@@ -87,7 +87,7 @@ uni.getSavedFileList({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|√| |√|x|√|√|√|x|√|
...@@ -125,7 +125,7 @@ uni.getSavedFileInfo({ ...@@ -125,7 +125,7 @@ uni.getSavedFileInfo({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
...@@ -160,7 +160,7 @@ uni.getSavedFileList({ ...@@ -160,7 +160,7 @@ uni.getSavedFileList({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
...@@ -187,7 +187,7 @@ uni.getSavedFileList({ ...@@ -187,7 +187,7 @@ uni.getSavedFileList({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
...@@ -223,8 +223,8 @@ uni.downloadFile({ ...@@ -223,8 +223,8 @@ uni.downloadFile({
|平台|打开方式| |平台|打开方式|
|:-|:-| |:-|:-|
|小程序|在小程序的入口应用内打开| |小程序|在小程序的入口应用内打开|
|5+App iOS|在当前应用内打开| |App iOS|在当前应用内打开|
|5+App Android|调用系统相关应用打开,无相关应用则不能打开| |App Android|调用系统相关应用打开,无相关应用则不能打开|
|H5|使用浏览器打开,当前浏览器不支持则不能打开| |H5|使用浏览器打开,当前浏览器不支持则不能打开|
**Tips** **Tips**
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|√| |√|√|√|x|√|√|√|
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|√| |√|x|√|x|√|√|√|
......
...@@ -10,15 +10,15 @@ App端如需要更丰富的相机拍照API(如直接调用前置摄像头) ...@@ -10,15 +10,15 @@ App端如需要更丰富的相机拍照API(如直接调用前置摄像头)
|参数名|类型|必填|说明|平台差异说明| |参数名|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|count|Number|否|最多可以选择的图片张数,默认9|见下方说明| |count|Number|否|最多可以选择的图片张数,默认9|见下方说明|
|sizeType|Array<String>|否|original 原图,compressed 压缩图,默认二者都有|5+App、微信小程序、支付宝小程序、百度小程序| |sizeType|Array<String>|否|original 原图,compressed 压缩图,默认二者都有|App、微信小程序、支付宝小程序、百度小程序|
|sourceType|Array<String>|否|album 从相册选图,camera 使用相机,默认二者都有。如需直接开相机或直接选相册,请只使用一个选项|| |sourceType|Array<String>|否|album 从相册选图,camera 使用相机,默认二者都有。如需直接开相机或直接选相册,请只使用一个选项||
|success|Function|是|成功则返回图片的本地文件路径列表 tempFilePaths|| |success|Function|是|成功则返回图片的本地文件路径列表 tempFilePaths||
|fail|Function|否|接口调用失败的回调函数|小程序、5+App| |fail|Function|否|接口调用失败的回调函数|小程序、App|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)| | |complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)| |
**Tips** **Tips**
- count 值在 H5 平台的表现,基于浏览器本身的规范。目前测试的结果来看,只能限制单选/多选,并不能限制数量。并且,在实际的手机浏览器很少有能够支持多选的。 - count 值在 H5 平台的表现,基于浏览器本身的规范。目前测试的结果来看,只能限制单选/多选,并不能限制数量。并且,在实际的手机浏览器很少有能够支持多选的。
- sourceType 在H5端对应`input``capture`属性,设置为`['album']`无效,依然可以使用相机。 - sourceType 在H5端对应`input``capture`属性,设置为`['album']`无效,依然可以使用相机。
- 可以通过用户授权API来判断用户是否给应用授予相册或摄像头的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize) - 可以通过用户授权API来判断用户是否给应用授予相册或摄像头的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
...@@ -60,9 +60,9 @@ uni.chooseImage({ ...@@ -60,9 +60,9 @@ uni.chooseImage({
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|current|String/Number|详见下方说明|详见下方说明|| |current|String/Number|详见下方说明|详见下方说明||
|urls|Array<String>|是|需要预览的图片链接列表|| |urls|Array<String>|是|需要预览的图片链接列表||
|indicator|String|否|图片指示器样式,可取值:"default" - 底部圆点指示器; "number" - 顶部数字指示器; "none" - 不显示指示器。|5+App| |indicator|String|否|图片指示器样式,可取值:"default" - 底部圆点指示器; "number" - 顶部数字指示器; "none" - 不显示指示器。|App|
|loop|Boolean|否|是否可循环预览,默认值为 false|5+App| |loop|Boolean|否|是否可循环预览,默认值为 false|App|
|longPressActions|Object|否|长按图片显示操作菜单,如不填默认为**保存相册**,1.9.5 起支持。|5+App| |longPressActions|Object|否|长按图片显示操作菜单,如不填默认为**保存相册**|App 1.9.5+|
|success|Function|否|接口调用成功的回调函数|| |success|Function|否|接口调用成功的回调函数||
|fail|Function|否|接口调用失败的回调函数|| |fail|Function|否|接口调用失败的回调函数||
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)| | |complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)| |
...@@ -134,7 +134,7 @@ uni.chooseImage({ ...@@ -134,7 +134,7 @@ uni.chooseImage({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|√| |√|√|√|√|√|√|
...@@ -193,7 +193,7 @@ uni.chooseImage({ ...@@ -193,7 +193,7 @@ uni.chooseImage({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序 |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√| |√|x|√|√|√|√|
...@@ -239,7 +239,7 @@ uni.chooseImage({ ...@@ -239,7 +239,7 @@ uni.chooseImage({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序 |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|1.9.7+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|√|√|√(基础库版本>=3.110.3)|√| |1.9.7+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|√|√|√(基础库版本>=3.110.3)|√|
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|√| |√|x|√|x|√|√|√|
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
|onStart|callback|录音开始事件|| |onStart|callback|录音开始事件||
|onPause|callback|录音暂停事件|| |onPause|callback|录音暂停事件||
|onStop|callback|录音停止事件,会回调文件地址|| |onStop|callback|录音停止事件,会回调文件地址||
|onFrameRecorded|callback|已录制完指定帧大小的文件,会回调录音分片结果数据。如果设置了 frameSize ,则会回调此事件|5+App 暂不支持| |onFrameRecorded|callback|已录制完指定帧大小的文件,会回调录音分片结果数据。如果设置了 frameSize ,则会回调此事件|App 暂不支持|
|onError|callback|录音错误事件, 会回调错误信息| | |onError|callback|录音错误事件, 会回调错误信息| |
**start(options) 说明** **start(options) 说明**
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|x| |x|x|√|√|√|√|x|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|x| |x|x|√|x|√|√|x|
...@@ -45,7 +45,7 @@ if (uni.getExtConfig) { ...@@ -45,7 +45,7 @@ if (uni.getExtConfig) {
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|x| |x|x|√|x|√|√|x|
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
......
...@@ -46,7 +46,7 @@ uni.navigateToMiniProgram({ ...@@ -46,7 +46,7 @@ uni.navigateToMiniProgram({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√| |x|x|√|√|√|√|√|
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5 |微信小程序 |支付宝小程序 |百度小程序 |头条小程序 |QQ小程序 | |App|H5 |微信小程序 |支付宝小程序 |百度小程序 |头条小程序 |QQ小程序 |
|:-: |:-:|:-: |:-: |:-: |:-: |:-: | |:-: |:-:|:-: |:-: |:-: |:-: |:-: |
|x |x |基础库版本>=2.8.2|x |x |x |x | |x |x |基础库版本>=2.8.2|x |x |x |x |
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√| |x|x|√|√|√|√|√|
...@@ -35,7 +35,7 @@ uni.openSetting({ ...@@ -35,7 +35,7 @@ uni.openSetting({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√| |x|x|√|√|√|√|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -66,7 +66,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templateadd?access_tok ...@@ -66,7 +66,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templateadd?access_tok
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -120,7 +120,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok ...@@ -120,7 +120,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -229,7 +229,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/libraryget?access_toke ...@@ -229,7 +229,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/libraryget?access_toke
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -318,7 +318,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/librarylist?access_tok ...@@ -318,7 +318,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/librarylist?access_tok
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -416,7 +416,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatelist?access_to ...@@ -416,7 +416,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatelist?access_to
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x| |x|x|√|x|√|x|x|
...@@ -549,7 +549,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok ...@@ -549,7 +549,7 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|x|√|x|x|x| |x|x|x|√|x|x|x|
......
...@@ -8,7 +8,7 @@ App的更新不使用本API,另见文档: ...@@ -8,7 +8,7 @@ App的更新不使用本API,另见文档:
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√| |x|x|√|√|√|√|√|
......
...@@ -101,7 +101,7 @@ uni.login({ ...@@ -101,7 +101,7 @@ uni.login({
|zh_TW|繁体中文| |zh_TW|繁体中文|
|en|英文| |en|英文|
**注意:**在小程序 withCredentials 为 true 时或是在 5+App 调用 uni.getUserInfo,要求此前有调用过 uni.login 且登录态尚未过期。 **注意:**在小程序 withCredentials 为 true 时或是在 App 调用 uni.getUserInfo,要求此前有调用过 uni.login 且登录态尚未过期。
**success 返回参数说明** **success 返回参数说明**
...@@ -119,7 +119,7 @@ uni.login({ ...@@ -119,7 +119,7 @@ uni.login({
|参数|类型|说明|平台差异说明| |参数|类型|说明|平台差异说明|
|:-|:-|:-|| |:-|:-|:-||
|nickName|String|用户昵称|| |nickName|String|用户昵称||
|openId|String|该服务商唯一用户标识|5+App| |openId|String|该服务商唯一用户标识|App|
|avatarUrl|String|用户头像| | |avatarUrl|String|用户头像| |
除了以上三个必有的信息外,不同服务供应商返回的其它信息会存在差异。 除了以上三个必有的信息外,不同服务供应商返回的其它信息会存在差异。
......
...@@ -11,7 +11,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在 ...@@ -11,7 +11,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|[说明](/api/plugins/payment?id=h5-payment)|√|√|√|√|√| |√|[说明](/api/plugins/payment?id=h5-payment)|√|√|√|√|√|
...@@ -20,7 +20,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在 ...@@ -20,7 +20,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在
|参数名|类型|必填|说明|平台差异说明| |参数名|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|| |:-|:-|:-|:-||
|provider|String|是|服务提供商,通过 [uni.getProvider](/api/plugins/provider) 获取。|| |provider|String|是|服务提供商,通过 [uni.getProvider](/api/plugins/provider) 获取。||
|orderInfo|String/Object|是|订单数据,[注意事项](/api/plugins/payment?id=orderinfo)|5+App、支付宝小程序、百度小程序、头条小程序| |orderInfo|String/Object|是|订单数据,[注意事项](/api/plugins/payment?id=orderinfo)|App、支付宝小程序、百度小程序、头条小程序|
|timeStamp|String|微信小程序必填|时间戳从1970年1月1日至今的秒数,即当前的时间。|微信小程序| |timeStamp|String|微信小程序必填|时间戳从1970年1月1日至今的秒数,即当前的时间。|微信小程序|
|nonceStr|String|微信小程序必填|随机字符串,长度为32个字符以下。|微信小程序| |nonceStr|String|微信小程序必填|随机字符串,长度为32个字符以下。|微信小程序|
|package|String|微信小程序必填|统一下单接口返回的 prepay_id 参数值,提交格式如:prepay_id=xx。|微信小程序| |package|String|微信小程序必填|统一下单接口返回的 prepay_id 参数值,提交格式如:prepay_id=xx。|微信小程序|
...@@ -41,7 +41,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在 ...@@ -41,7 +41,7 @@ uni.requestPayment是一个统一各平台的客户端支付API,不管是在
#### orderInfo 注意事项@orderInfo #### orderInfo 注意事项@orderInfo
1. 百度小程序的 orderInfo 为 Object 类型,详细的数据结构,参考:[百度收银台支付](https://smartprogram.baidu.com/docs/develop/api/open_payment/#requestPolymerPayment/) 1. 百度小程序的 orderInfo 为 Object 类型,详细的数据结构,参考:[百度收银台支付](https://smartprogram.baidu.com/docs/develop/api/open_payment/#requestPolymerPayment/)
2. 支付宝小程序的 orderInfo(支付宝的规范为 tradeNO) 为 String 类型,表示支付宝交易号。 2. 支付宝小程序的 orderInfo(支付宝的规范为 tradeNO) 为 String 类型,表示支付宝交易号。
3. 头条小程序的 orderInfo 为 Object 类型,详见:[发起头条支付](https://developer.toutiao.com/dev/cn/mini-app/develop/open-capacity/payment/pay) 3. 头条小程序的 orderInfo 为 Object 类型,详见:[发起头条支付](https://developer.toutiao.com/dev/cn/mini-app/develop/open-capacity/payment/pay)
4. 由于头条新版支付接口要求版本较高,在不支持新版支付接口的情况下仍会对应旧版支付接口,此时 orderInfo 对应头条小程序 data, 详见:[头条支付旧版接口](https://developer.toutiao.com/dev/cn/mini-app/develop/open-capacity/payment/requestpayment-deprecated)。用户可以使用 tt.pay 判断是否支持新版接口。另外需要注意头条小程序在`1.35.0+`版本基础库支持了 canIUse ,在`1.19.4+`版本基础库支持了新版支付接口 tt.pay ,所以应避免使用 canIUse 判断是否为新版接口。 4. 由于头条新版支付接口要求版本较高,在不支持新版支付接口的情况下仍会对应旧版支付接口,此时 orderInfo 对应头条小程序 data, 详见:[头条支付旧版接口](https://developer.toutiao.com/dev/cn/mini-app/develop/open-capacity/payment/requestpayment-deprecated)。用户可以使用 tt.pay 判断是否支持新版接口。另外需要注意头条小程序在`1.35.0+`版本基础库支持了 canIUse ,在`1.19.4+`版本基础库支持了新版支付接口 tt.pay ,所以应避免使用 canIUse 判断是否为新版接口。
5. App端,支付宝支付和微信支付 orderInfo 均为 String 类型。 5. App端,支付宝支付和微信支付 orderInfo 均为 String 类型。
6. App端,苹果应用内支付 orderInfo 为Object 类型,{productid: 'productid'}。 6. App端,苹果应用内支付 orderInfo 为Object 类型,{productid: 'productid'}。
......
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
开启推送 开启推送
平台差异说明: 平台差异说明:
- 5+App - App
**OBJECT 参数说明** **OBJECT 参数说明**
...@@ -87,7 +87,7 @@ uni.getProvider({ ...@@ -87,7 +87,7 @@ uni.getProvider({
**平台差异说明** **平台差异说明**
- 5+App - App
**OBJECT 参数说明** **OBJECT 参数说明**
...@@ -115,7 +115,7 @@ uni.unsubscribePush({ ...@@ -115,7 +115,7 @@ uni.unsubscribePush({
**平台差异说明** **平台差异说明**
- 5+App - App
**OBJECT 参数说明** **OBJECT 参数说明**
...@@ -147,7 +147,7 @@ uni.onPush({ ...@@ -147,7 +147,7 @@ uni.onPush({
**平台差异说明** **平台差异说明**
- 5+App - App
**OBJECT 参数说明** **OBJECT 参数说明**
......
...@@ -215,7 +215,7 @@ uni.share({ ...@@ -215,7 +215,7 @@ uni.share({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√| |x|x|√|√|√|√|
...@@ -263,7 +263,7 @@ export default { ...@@ -263,7 +263,7 @@ export default {
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√| |x|x|√|x|√|√|
...@@ -283,7 +283,7 @@ export default { ...@@ -283,7 +283,7 @@ export default {
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|x|√| |x|x|√|√|x|√|
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
|参数名|类型|必填|说明|平台差异说明| |参数名|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|url|String|是|开发者服务器 url|| |url|String|是|开发者服务器 url||
|files|Array|否|需要上传的文件列表。**使用 files 时,filePath 和 name 不生效。**|5+App| |files|Array|否|需要上传的文件列表。**使用 files 时,filePath 和 name 不生效。**|App|
|fileType|String|见平台差异说明|文件类型,image/video/audio|仅支付宝小程序,且必填。| |fileType|String|见平台差异说明|文件类型,image/video/audio|仅支付宝小程序,且必填。|
|filePath|String|是|要上传文件资源的路径。|| |filePath|String|是|要上传文件资源的路径。||
|name|String|是|文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容|| |name|String|是|文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容||
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
**注意** **注意**
- 5+App支持多文件上传,微信小程序只支持单文件上传,传多个文件需要反复调用本API。所以跨端的写法就是循环调用本API。 - App支持多文件上传,微信小程序只支持单文件上传,传多个文件需要反复调用本API。所以跨端的写法就是循环调用本API。
- hello uni-app中的客服反馈,支持多图上传。[uni-app插件市场](https://ext.dcloud.net.cn/)中也有多个封装的组件。 - hello uni-app中的客服反馈,支持多图上传。[uni-app插件市场](https://ext.dcloud.net.cn/)中也有多个封装的组件。
- App平台选择和上传非图像、视频文件,参考[https://ask.dcloud.net.cn/article/35547](https://ask.dcloud.net.cn/article/35547) - App平台选择和上传非图像、视频文件,参考[https://ask.dcloud.net.cn/article/35547](https://ask.dcloud.net.cn/article/35547)
- 网络请求的 ``超时时间`` 可以统一在 ``manifest.json`` 中配置 [networkTimeout](/collocation/manifest?id=networktimeout) - 网络请求的 ``超时时间`` 可以统一在 ``manifest.json`` 中配置 [networkTimeout](/collocation/manifest?id=networktimeout)
...@@ -86,12 +86,12 @@ uploadTask.abort(); ...@@ -86,12 +86,12 @@ uploadTask.abort();
**uploadTask 对象的方法列表** **uploadTask 对象的方法列表**
|方法|参数|说明| |方法|参数|说明|
|:-|:-|:-| |:-|:-|:-|
|abort||中断上传任务| |abort||中断上传任务|
|onProgressUpdate|callback|监听上传进度变化| |onProgressUpdate|callback|监听上传进度变化|
|onHeadersReceived|callback|监听 HTTP Response Header 事件。会比请求完成事件更早,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.onHeadersReceived.html)| |onHeadersReceived|callback|监听 HTTP Response Header 事件。会比请求完成事件更早,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.onHeadersReceived.html)|
|offProgressUpdate|callback|取消监听上传进度变化事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.offProgressUpdate.html)| |offProgressUpdate|callback|取消监听上传进度变化事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.offProgressUpdate.html)|
|offHeadersReceived|callback|取消监听 HTTP Response Header 事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.offHeadersReceived.html)| |offHeadersReceived|callback|取消监听 HTTP Response Header 事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.offHeadersReceived.html)|
**onProgressUpdate 返回参数说明** **onProgressUpdate 返回参数说明**
...@@ -192,12 +192,12 @@ downloadTask.abort(); ...@@ -192,12 +192,12 @@ downloadTask.abort();
**downloadTask 对象的方法列表** **downloadTask 对象的方法列表**
|方法|参数|说明|最低版本| |方法|参数|说明|最低版本|
|:-|:-|:-|:-| |:-|:-|:-|:-|
|abort||中断下载任务|*| |abort||中断下载任务|*|
|onProgressUpdate|callback|监听下载进度变化|*| |onProgressUpdate|callback|监听下载进度变化|*|
|onHeadersReceived|callback|监听 HTTP Response Header 事件,会比请求完成事件更早,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.onHeadersReceived.html)| |onHeadersReceived|callback|监听 HTTP Response Header 事件,会比请求完成事件更早,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.onHeadersReceived.html)|
|offProgressUpdate|callback|取消监听下载进度变化事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.offProgressUpdate.html)| |offProgressUpdate|callback|取消监听下载进度变化事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.offProgressUpdate.html)|
|offHeadersReceived|callback|取消监听 HTTP Response Header 事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.offHeadersReceived.html)| |offHeadersReceived|callback|取消监听 HTTP Response Header 事件,仅`微信小程序平台`支持,[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/DownloadTask.offHeadersReceived.html)|
**onProgressUpdate 返回参数说明** **onProgressUpdate 返回参数说明**
......
...@@ -8,13 +8,13 @@ ...@@ -8,13 +8,13 @@
|参数名|类型|必填|默认值|说明|平台差异说明| |参数名|类型|必填|默认值|说明|平台差异说明|
|:-|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|:-|
|url|String|是||开发者服务器接口地址|| |url|String|是||开发者服务器接口地址||
|data|Object/String/ArrayBuffer|否||请求的参数|5+App(自定义组件编译模式)不支持ArrayBuffer类型| |data|Object/String/ArrayBuffer|否||请求的参数|App(自定义组件编译模式)不支持ArrayBuffer类型|
|header|Object|否||设置请求的 header,header 中不能设置 Referer。|| |header|Object|否||设置请求的 header,header 中不能设置 Referer。||
|method|String|否|GET|有效值详见下方说明|| |method|String|否|GET|有效值详见下方说明||
|timeout|Number|否|30000|超时时间,单位 ms|支付宝小程序| |timeout|Number|否|30000|超时时间,单位 ms|支付宝小程序|
|dataType|String|否|json |如果设为 json,会尝试对返回的数据做一次 JSON.parse|| |dataType|String|否|json |如果设为 json,会尝试对返回的数据做一次 JSON.parse||
|responseType|String|否|text |设置响应的数据类型。合法值:text、arraybuffer|5+App和支付宝小程序不支持| |responseType|String|否|text |设置响应的数据类型。合法值:text、arraybuffer|App和支付宝小程序不支持|
|sslVerify|Boolean|否|true|验证 ssl 证书|仅5+App安卓端支持(HBuilderX 2.3.3+)| |sslVerify|Boolean|否|true|验证 ssl 证书|仅App安卓端支持(HBuilderX 2.3.3+)|
|success|Function|否||收到开发者服务成功返回的回调函数|| |success|Function|否||收到开发者服务成功返回的回调函数||
|fail|Function|否||接口调用失败的回调函数|| |fail|Function|否||接口调用失败的回调函数||
|complete|Function|否||接口调用结束的回调函数(调用成功、失败都会执行)| | |complete|Function|否||接口调用结束的回调函数(调用成功、失败都会执行)| |
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
必须大写,有效值在不同平台差异说明不同。 必须大写,有效值在不同平台差异说明不同。
|method|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |method|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|GET|√|√|√|√|√|√| |GET|√|√|√|√|√|√|
|POST|√|√|√|√|√|√| |POST|√|√|√|√|√|√|
......
...@@ -7,8 +7,8 @@ ...@@ -7,8 +7,8 @@
|参数|类型|必填|默认值|说明|平台差异说明| |参数|类型|必填|默认值|说明|平台差异说明|
|:-|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|:-|
|url|String|是||需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔;如 'path?key=value&key2=value2',path为下一个页面的路径,下一个页面的onLoad函数可得到传递的参数|:-| |url|String|是||需要跳转的应用内非 tabBar 的页面的路径 , 路径后可以带参数。参数与路径之间使用?分隔,参数键与参数值用=相连,不同参数用&分隔;如 'path?key=value&key2=value2',path为下一个页面的路径,下一个页面的onLoad函数可得到传递的参数|:-|
|animationType|String|否|pop-in|窗口显示的动画效果,详见:[窗口动画](api/router?id=animation)|5+App| |animationType|String|否|pop-in|窗口显示的动画效果,详见:[窗口动画](api/router?id=animation)|App|
|animationDuration|Number|否|300|窗口动画持续时间,单位为 ms|5+App| |animationDuration|Number|否|300|窗口动画持续时间,单位为 ms|App|
|success|Function|否||接口调用成功的回调函数|| |success|Function|否||接口调用成功的回调函数||
|fail|Function|否||接口调用失败的回调函数|| |fail|Function|否||接口调用失败的回调函数||
|complete|Function|否||接口调用结束的回调函数(调用成功、失败都会执行)| | |complete|Function|否||接口调用结束的回调函数(调用成功、失败都会执行)| |
...@@ -145,8 +145,8 @@ uni.switchTab({ ...@@ -145,8 +145,8 @@ uni.switchTab({
|参数|类型|必填|默认值|说明|平台差异说明| |参数|类型|必填|默认值|说明|平台差异说明|
|:-|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|:-|
|delta|Number|否|1|返回的页面数,如果 delta 大于现有页面数,则返回到首页。|| |delta|Number|否|1|返回的页面数,如果 delta 大于现有页面数,则返回到首页。||
|animationType|String|否|pop-out|窗口关闭的动画效果,详见:[窗口动画](api/router?id=animation)|5+App| |animationType|String|否|pop-out|窗口关闭的动画效果,详见:[窗口动画](api/router?id=animation)|App|
|animationDuration|Number|否|300|窗口关闭动画的持续时间,单位为 ms|5+App| |animationDuration|Number|否|300|窗口关闭动画的持续时间,单位为 ms|App|
**示例** **示例**
......
...@@ -28,7 +28,7 @@ uni.onAccelerometerChange(function (res) { ...@@ -28,7 +28,7 @@ uni.onAccelerometerChange(function (res) {
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√| |√|√|√|x|√|√|
......
**低功耗蓝牙 API 平台差异说明** **低功耗蓝牙 API 平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|x|x|x| |√|x|√|√|x|x|x|
......
**蓝牙 API 平台差异说明** **蓝牙 API 平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|x|x|x| |√|x|√|√|x|x|x|
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|√| |√|x|√|√|√|x|√|
...@@ -32,7 +32,7 @@ uni.setScreenBrightness({ ...@@ -32,7 +32,7 @@ uni.setScreenBrightness({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|√| |√|x|√|√|√|x|√|
...@@ -65,7 +65,7 @@ uni.getScreenBrightness({ ...@@ -65,7 +65,7 @@ uni.getScreenBrightness({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√| |x|x|√|√|√|√|√|
......
**剪贴板 API 平台差异说明** **剪贴板 API 平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
### uni.setClipboardData(OBJECT) ### uni.setClipboardData(OBJECT)
......
...@@ -23,7 +23,7 @@ uni.onCompassChange(function (res) { ...@@ -23,7 +23,7 @@ uni.onCompassChange(function (res) {
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|√| |√|√|√|x|√|√|√|
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|x|x| |x|x|√|√|x|x|
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|x|x| |x|x|√|√|x|x|
...@@ -47,7 +47,7 @@ ...@@ -47,7 +47,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|x|x| |x|x|√|√|x|x|
......
**iBeacon API 平台差异说明** **iBeacon API 平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|x|x|x| |√|x|√|√|x|x|x|
......
...@@ -13,15 +13,15 @@ ...@@ -13,15 +13,15 @@
|参数|说明|平台差异说明| |参数|说明|平台差异说明|
|:-|:-|:-| |:-|:-|:-|
|brand|手机品牌|5+App、微信小程序、百度小程序、头条小程序、QQ小程序| |brand|手机品牌|App、微信小程序、百度小程序、头条小程序、QQ小程序|
|model|手机型号|| |model|手机型号||
|pixelRatio|设备像素比|| |pixelRatio|设备像素比||
|screenWidth|屏幕宽度|| |screenWidth|屏幕宽度||
|screenHeight|屏幕高度|| |screenHeight|屏幕高度||
|windowWidth|可使用窗口宽度|| |windowWidth|可使用窗口宽度||
|windowHeight|可使用窗口高度|| |windowHeight|可使用窗口高度||
|windowTop|可使用窗口的顶部位置|5+App、H5| |windowTop|可使用窗口的顶部位置|App、H5|
|windowBottom|可使用窗口的底部位置|5+App、H5| |windowBottom|可使用窗口的底部位置|App、H5|
|statusBarHeight|状态栏的高度|头条小程序不支持| |statusBarHeight|状态栏的高度|头条小程序不支持|
|navigationBarHeight|导航栏的高度|百度小程序| |navigationBarHeight|导航栏的高度|百度小程序|
|titleBarHeight|标题栏高度|支付宝小程序| |titleBarHeight|标题栏高度|支付宝小程序|
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
|bluetoothEnabled | 蓝牙的系统开关 |微信小程序| |bluetoothEnabled | 蓝牙的系统开关 |微信小程序|
|locationEnabled | 地理位置的系统开关 |微信小程序| |locationEnabled | 地理位置的系统开关 |微信小程序|
|wifiEnabled | Wi-Fi 的系统开关 |微信小程序| |wifiEnabled | Wi-Fi 的系统开关 |微信小程序|
|safeArea|在竖屏正方向下的安全区域|5+App、H5、微信小程序| |safeArea|在竖屏正方向下的安全区域|App、H5、微信小程序|
**Tips** **Tips**
- 屏幕高度=状态栏高度+原生导航栏高度+可使用窗口高度+原生tabbar高度 - 屏幕高度=状态栏高度+原生导航栏高度+可使用窗口高度+原生tabbar高度
...@@ -92,15 +92,15 @@ uni.getSystemInfo({ ...@@ -92,15 +92,15 @@ uni.getSystemInfo({
|参数|说明|平台差异说明| |参数|说明|平台差异说明|
|:-|:-|:-| |:-|:-|:-|
|brand|手机品牌|5+App、微信小程序、百度小程序、头条小程序、QQ小程序| |brand|手机品牌|App、微信小程序、百度小程序、头条小程序、QQ小程序|
|model|手机型号|| |model|手机型号||
|pixelRatio|设备像素比|| |pixelRatio|设备像素比||
|screenWidth|屏幕宽度|| |screenWidth|屏幕宽度||
|screenHeight|屏幕高度|| |screenHeight|屏幕高度||
|windowWidth|可使用窗口宽度|| |windowWidth|可使用窗口宽度||
|windowHeight|可使用窗口高度|| |windowHeight|可使用窗口高度||
|windowTop|可使用窗口的顶部位置|5+App、H5| |windowTop|可使用窗口的顶部位置|App、H5|
|windowBottom|可使用窗口的底部位置|5+App、H5| |windowBottom|可使用窗口的底部位置|App、H5|
|statusBarHeight|状态栏的高度|头条小程序不支持| |statusBarHeight|状态栏的高度|头条小程序不支持|
|navigationBarHeight|导航栏的高度|百度小程序| |navigationBarHeight|导航栏的高度|百度小程序|
|titleBarHeight|标题栏高度|支付宝小程序| |titleBarHeight|标题栏高度|支付宝小程序|
...@@ -129,7 +129,7 @@ uni.getSystemInfo({ ...@@ -129,7 +129,7 @@ uni.getSystemInfo({
|bluetoothEnabled | 蓝牙的系统开关 |微信小程序| |bluetoothEnabled | 蓝牙的系统开关 |微信小程序|
|locationEnabled | 地理位置的系统开关 |微信小程序| |locationEnabled | 地理位置的系统开关 |微信小程序|
|wifiEnabled | Wi-Fi 的系统开关 |微信小程序| |wifiEnabled | Wi-Fi 的系统开关 |微信小程序|
|safeArea|在竖屏正方向下的安全区域|5+App、H5、微信小程序| |safeArea|在竖屏正方向下的安全区域|App、H5、微信小程序|
**Tips** **Tips**
- 使用注意同上getSystemInfo - 使用注意同上getSystemInfo
...@@ -192,7 +192,7 @@ Android10以上,部分国产手机支持OAID,详见[匿名设备标识符( ...@@ -192,7 +192,7 @@ Android10以上,部分国产手机支持OAID,详见[匿名设备标识符(
平台差异说明 平台差异说明
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√| |√|x|√|√|√|√|√|
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|x|√| |x|x|√|√|√|x|√|
......
...@@ -23,7 +23,7 @@ ...@@ -23,7 +23,7 @@
|2g|2g 网络|| |2g|2g 网络||
|3g|3g 网络|| |3g|3g 网络||
|4g|4g 网络|| |4g|4g 网络||
|ethernet|有线网络|5+App| |ethernet|有线网络|App|
|unknown|Android 下不常见的网络类型|| |unknown|Android 下不常见的网络类型||
|none|无网络| | |none|无网络| |
......
...@@ -4,12 +4,12 @@ ...@@ -4,12 +4,12 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|HBuilderX 2.0.4+|√|√|√|√|√| |√|HBuilderX 2.0.4+|√|√|√|√|√|
**注意:** **注意:**
- export 方法每次调用后会清掉之前的动画操作 - export 方法每次调用后会清掉之前的动画操作
- nvue 暂不支持 - nvue 暂不支持
**OBJECT参数说明:** **OBJECT参数说明:**
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
...@@ -35,7 +35,7 @@ uni.setBackgroundColor({ ...@@ -35,7 +35,7 @@ uni.setBackgroundColor({
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
......
...@@ -2,30 +2,30 @@ ...@@ -2,30 +2,30 @@
在小程序平台,如果原生导航栏被隐藏,仍然在右上角会有一个悬浮按钮,微信下也被称为胶囊按钮。本API用于获取小程序下该菜单按钮的布局位置信息,方便开发者布局顶部内容时避开该按钮。 在小程序平台,如果原生导航栏被隐藏,仍然在右上角会有一个悬浮按钮,微信下也被称为胶囊按钮。本API用于获取小程序下该菜单按钮的布局位置信息,方便开发者布局顶部内容时避开该按钮。
坐标信息以屏幕左上角为原点。 坐标信息以屏幕左上角为原点。
**平台差异说明** **平台差异说明**
|5+App |H5 |微信小程序 |支付宝小程序 |百度小程序 |头条小程序 |QQ小程序 | |App |H5 |微信小程序 |支付宝小程序 |百度小程序 |头条小程序 |QQ小程序 |
|:-: |:-:|:-: |:-: |:-: |:-: |:-: | |:-: |:-:|:-: |:-: |:-: |:-: |:-: |
|x |x |√ |x |√ |√ |√ | |x |x |√ |x |√ |√ |√ |
**返回值说明** **返回值说明**
|属性 |类型 |说明 | |属性 |类型 |说明 |
|width |number |宽度,单位:px | |width |number |宽度,单位:px |
|height |number |高度,单位:px | |height |number |高度,单位:px |
|top |number |上边界坐标,单位:px | |top |number |上边界坐标,单位:px |
|right |number |右边界坐标,单位:px | |right |number |右边界坐标,单位:px |
|bottom |number |下边界坐标,单位:px | |bottom |number |下边界坐标,单位:px |
|left |number |左边界坐标,单位:px | |left |number |左边界坐标,单位:px |
**示例** **示例**
```javascript ```javascript
let menuButtonInfo = uni.getMenuButtonBoundingClientRect() let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
``` ```
**注意** **注意**
- 支付宝小程序:其逻辑与微信小程序不同,它提供了菜单点击后按钮的自定义功能,可以选择显示那些系统按钮,[规范详情](https://docs.alipay.com/mini/api/optionmenuitem) - 支付宝小程序:其逻辑与微信小程序不同,它提供了菜单点击后按钮的自定义功能,可以选择显示那些系统按钮,[规范详情](https://docs.alipay.com/mini/api/optionmenuitem)
...@@ -34,7 +34,7 @@ uni.setNavigationBarTitle({ ...@@ -34,7 +34,7 @@ uni.setNavigationBarTitle({
|参数|类型|必填|说明|平台差异说明| |参数|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|frontColor|String|是|前景颜色值,包括按钮、标题、状态栏的颜色,仅支持 #ffffff 和 #000000|5+App、H5、微信小程序、百度小程序| |frontColor|String|是|前景颜色值,包括按钮、标题、状态栏的颜色,仅支持 #ffffff 和 #000000|App、H5、微信小程序、百度小程序|
|backgroundColor|String|是|背景颜色值,有效值为十六进制颜色|| |backgroundColor|String|是|背景颜色值,有效值为十六进制颜色||
|animation|Object|否|动画效果,{duration,timingFunc}|微信小程序、百度小程序| |animation|Object|否|动画效果,{duration,timingFunc}|微信小程序、百度小程序|
|success|Function|否|接口调用成功的回调函数|| |success|Function|否|接口调用成功的回调函数||
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序 |支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序 |支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√(nvue不支持)|√|√|x|x|x|√| |√(nvue不支持)|√|√|x|x|x|√|
...@@ -35,7 +35,7 @@ uni.onWindowResize((res) => { ...@@ -35,7 +35,7 @@ uni.onWindowResize((res) => {
平台差异说明 平台差异说明
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|x|x| |√|√|√|x|x|x|
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
|方法|描述|平台说明| |方法|描述|平台说明|
|---|---|---| |---|---|---|
|page.$getAppWebview()|获取当前页面的webview对象实例|5+App| |page.$getAppWebview()|获取当前页面的webview对象实例|App|
|page.route|获取当前页面的路由| | |page.route|获取当前页面的路由| |
Tips: Tips:
...@@ -25,9 +25,9 @@ Tips: ...@@ -25,9 +25,9 @@ Tips:
但`uni-app`框架有自己的窗口管理机制,请不要自己创建和销毁webview,如有需求覆盖子窗体上去,请使用[原生子窗体subNvue](/api/window/subNVues)。 但`uni-app`框架有自己的窗口管理机制,请不要自己创建和销毁webview,如有需求覆盖子窗体上去,请使用[原生子窗体subNvue](/api/window/subNVues)。
**注意:此方法仅 5+app 支持** **注意:此方法仅 App 支持**
**示例:** **示例:**
获取当前页面 webview 的对象实例 获取当前页面 webview 的对象实例
```javascript ```javascript
...@@ -44,8 +44,8 @@ export default { ...@@ -44,8 +44,8 @@ export default {
// #endif // #endif
} }
} }
``` ```
获取指定页面 webview 的对象实例 获取指定页面 webview 的对象实例
`getCurrentPages()`可以得到所有页面对象,然后根据数组,可以取指定的页面webview对象 `getCurrentPages()`可以得到所有页面对象,然后根据数组,可以取指定的页面webview对象
......
...@@ -13,66 +13,66 @@ console.log(app.globalData) ...@@ -13,66 +13,66 @@ console.log(app.globalData)
- 不要在定义于 `App()` 内的函数中,或调用 `App` 前调用 `getApp()` ,可以通过 `this.$scope` 获取对应的app实例 - 不要在定义于 `App()` 内的函数中,或调用 `App` 前调用 `getApp()` ,可以通过 `this.$scope` 获取对应的app实例
- 通过 `getApp()` 获取实例之后,不要私自调用生命周期函数。 - 通过 `getApp()` 获取实例之后,不要私自调用生命周期函数。
- v3模式加速了首页`nvue`的启动速度,当在首页`nvue`中使用`getApp()`不一定可以获取真正的`App`对象。对此v3版本提供了`const app = getApp({allowDefault: true})`用来获取原始的`App`对象,可以用来在首页对`globalData`等初始化 - v3模式加速了首页`nvue`的启动速度,当在首页`nvue`中使用`getApp()`不一定可以获取真正的`App`对象。对此v3版本提供了`const app = getApp({allowDefault: true})`用来获取原始的`App`对象,可以用来在首页对`globalData`等初始化
### getCurrentPages() ### getCurrentPages()
```getCurrentPages()``` 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。 ```getCurrentPages()``` 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。
**注意:** ``getCurrentPages()``仅用于展示页面栈的情况,请勿修改页面栈,以免造成页面状态错误。 **注意:** ``getCurrentPages()``仅用于展示页面栈的情况,请勿修改页面栈,以免造成页面状态错误。
每个页面实例的方法属性列表: 每个页面实例的方法属性列表:
|方法|描述|平台说明| |方法|描述|平台说明|
|---|---|---| |---|---|---|
|page.$getAppWebview()|获取当前页面的webview对象实例|5+App| |page.$getAppWebview()|获取当前页面的webview对象实例|App|
|page.route|获取当前页面的路由| | |page.route|获取当前页面的路由| |
Tips: Tips:
* ``navigateTo``, ``redirectTo`` 只能打开非 tabBar 页面。 * ``navigateTo``, ``redirectTo`` 只能打开非 tabBar 页面。
* ``switchTab`` 只能打开 ``tabBar`` 页面。 * ``switchTab`` 只能打开 ``tabBar`` 页面。
* ``reLaunch`` 可以打开任意页面。 * ``reLaunch`` 可以打开任意页面。
* 页面底部的 ``tabBar`` 由页面决定,即只要是定义为 ``tabBar`` 的页面,底部都有 ``tabBar``。 * 页面底部的 ``tabBar`` 由页面决定,即只要是定义为 ``tabBar`` 的页面,底部都有 ``tabBar``。
* 不能在 ```App.vue``` 里面进行页面跳转。 * 不能在 ```App.vue``` 里面进行页面跳转。
### $getAppWebview() ### $getAppWebview()
```uni-app``` 在 ```getCurrentPages()```获得的页面里内置了一个方法 ```$getAppWebview()``` 可以得到当前webview的对象实例,从而实现对 webview 更强大的控制。在 html5Plus 中,plus.webview具有强大的控制能力,可参考:[WebviewObject](http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.WebviewObject)。 ```uni-app``` 在 ```getCurrentPages()```获得的页面里内置了一个方法 ```$getAppWebview()``` 可以得到当前webview的对象实例,从而实现对 webview 更强大的控制。在 html5Plus 中,plus.webview具有强大的控制能力,可参考:[WebviewObject](http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.WebviewObject)。
但`uni-app`框架有自己的窗口管理机制,请不要自己创建和销毁webview,如有需求覆盖子窗体上去,请使用[原生子窗体subNvue](/api/window/subNVues)。 但`uni-app`框架有自己的窗口管理机制,请不要自己创建和销毁webview,如有需求覆盖子窗体上去,请使用[原生子窗体subNvue](/api/window/subNVues)。
**注意:此方法仅 5+app 支持** **注意:此方法仅 App 支持**
**示例:** **示例:**
获取当前页面 webview 的对象实例 获取当前页面 webview 的对象实例
```javascript ```javascript
export default { export default {
data() { data() {
return { return {
title: 'Hello' title: 'Hello'
} }
}, },
onLoad() { onLoad() {
// #ifdef APP-PLUS // #ifdef APP-PLUS
const currentWebview = this.$mp.page.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里,直接使用plus.webview.currentWebview()无效 const currentWebview = this.$mp.page.$getAppWebview(); //此对象相当于html5plus里的plus.webview.currentWebview()。在uni-app里,直接使用plus.webview.currentWebview()无效
currentWebview.setBounce({position:{top:'100px'},changeoffset:{top:'0px'}}); //动态重设bounce效果 currentWebview.setBounce({position:{top:'100px'},changeoffset:{top:'0px'}}); //动态重设bounce效果
// #endif // #endif
} }
} }
```
获取指定页面 webview 的对象实例
`getCurrentPages()`可以得到所有页面对象,然后根据数组,可以取指定的页面webview对象
```javascript
var pages = getCurrentPages();
var page = pages[pages.length - 1];
// #ifdef APP-PLUS
var currentWebview = page.$getAppWebview();
console.log(currentWebview.id);//获得当前webview的id
console.log(currentWebview.isVisible());//查询当前webview是否可见
);
// #endif
``` ```
获取指定页面 webview 的对象实例
`getCurrentPages()`可以得到所有页面对象,然后根据数组,可以取指定的页面webview对象
```javascript
var pages = getCurrentPages();
var page = pages[pages.length - 1];
// #ifdef APP-PLUS
var currentWebview = page.$getAppWebview();
console.log(currentWebview.id);//获得当前webview的id
console.log(currentWebview.isVisible());//查询当前webview是否可见
);
// #endif
```
uni-app自带的web-view组件,是页面中新插入的一个子webview。获取该对象的方法见:[https://ask.dcloud.net.cn/article/35036](https://ask.dcloud.net.cn/article/35036) uni-app自带的web-view组件,是页面中新插入的一个子webview。获取该对象的方法见:[https://ask.dcloud.net.cn/article/35036](https://ask.dcloud.net.cn/article/35036)
\ No newline at end of file
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
|transformPx|Boolean|true|是否转换项目的px,为true时将px转换为rpx,为false时,px为传统的实际像素|| |transformPx|Boolean|true|是否转换项目的px,为true时将px转换为rpx,为false时,px为传统的实际像素||
|networkTimeout|Object||网络超时时间,[详见](/collocation/manifest?id=networktimeout)|| |networkTimeout|Object||网络超时时间,[详见](/collocation/manifest?id=networktimeout)||
|debug|Boolean|false|是否开启 debug 模式,开启后调试信息以 ``info`` 的形式给出,其信息有页面的注册,页面路由,数据更新,事件触发等|| |debug|Boolean|false|是否开启 debug 模式,开启后调试信息以 ``info`` 的形式给出,其信息有页面的注册,页面路由,数据更新,事件触发等||
|app-plus|Object||[5+App 特有配置](/collocation/manifest?id=app-plus)|| |app-plus|Object||[App 特有配置](/collocation/manifest?id=app-plus)||
|h5|Object||[H5 特有配置](/collocation/manifest?id=h5)|| |h5|Object||[H5 特有配置](/collocation/manifest?id=h5)||
|quickapp|Object||快应用特有配置,即将支持|| |quickapp|Object||快应用特有配置,即将支持||
|mp-weixin|Object||[微信小程序特有配置](/collocation/manifest?id=mp-weixin)|| |mp-weixin|Object||[微信小程序特有配置](/collocation/manifest?id=mp-weixin)||
...@@ -42,9 +42,9 @@ ...@@ -42,9 +42,9 @@
|属性|类型|说明|最低版本| |属性|类型|说明|最低版本|
|:-|:-|:-|:-| |:-|:-|:-|:-|
|splashscreen|Object|5+App 启动界面信息,[详见](/collocation/manifest?id=splashscreen)|| |splashscreen|Object|App 启动界面信息,[详见](/collocation/manifest?id=splashscreen)||
|modules|Object|权限模块,[详见](/collocation/manifest?id=modules)|| |modules|Object|权限模块,[详见](/collocation/manifest?id=modules)||
|distribute|Object|5+App 发布信息,[详见](/collocation/manifest?id=distribute)|| |distribute|Object|App 发布信息,[详见](/collocation/manifest?id=distribute)||
|usingComponents|Boolean|是否启用自定义组件模式,默认为false,[编译模式区别详情](https://ask.dcloud.net.cn/article/35843)|1.9.0+| |usingComponents|Boolean|是否启用自定义组件模式,默认为false,[编译模式区别详情](https://ask.dcloud.net.cn/article/35843)|1.9.0+|
|nvueCompiler|String|切换 nvue 编译模式,可选值,`weex` :老编译模式,`uni-app`: 新编译模式,默认为 `weex`[编译模式区别详情](http://ask.dcloud.net.cn/article/36074)|2.0.3+| |nvueCompiler|String|切换 nvue 编译模式,可选值,`weex` :老编译模式,`uni-app`: 新编译模式,默认为 `weex`[编译模式区别详情](http://ask.dcloud.net.cn/article/36074)|2.0.3+|
|renderer|String|可不加载基于 webview 的运行框架,减少包体积、提升启动速度。可选值 `native`| App-nvue 2.2.0+| |renderer|String|可不加载基于 webview 的运行框架,减少包体积、提升启动速度。可选值 `native`| App-nvue 2.2.0+|
...@@ -357,13 +357,13 @@ Tips:关于摇树优化(treeShaking)原理及优化结果,参考:[http ...@@ -357,13 +357,13 @@ Tips:关于摇树优化(treeShaking)原理及优化结果,参考:[http
|:- |:- |:- | |:- |:- |:- |
|usingComponents |Boolean| 是否启用自定义组件模式,`v2.0+`,默认为false,[编译模式区别详情](https://ask.dcloud.net.cn/article/35843) | |usingComponents |Boolean| 是否启用自定义组件模式,`v2.0+`,默认为false,[编译模式区别详情](https://ask.dcloud.net.cn/article/35843) |
|component2 |Boolean| 是否启用 `component2` 编译,默认为false,[查看详情](https://docs.alipay.com/mini/framework/custom-component-overview) | |component2 |Boolean| 是否启用 `component2` 编译,默认为false,[查看详情](https://docs.alipay.com/mini/framework/custom-component-overview) |
|axmlStrictCheck |Boolean| 是否启用 `axml` 严格语法检查,默认为false | |axmlStrictCheck |Boolean| 是否启用 `axml` 严格语法检查,默认为false |
|enableParallelLoader |Boolean| 是否启用多进程编译,默认为false | |enableParallelLoader |Boolean| 是否启用多进程编译,默认为false |
|enableDistFileMinify |Boolean| 是否压缩编译产物(仅在真机预览/真机调试时生效),默认为false | |enableDistFileMinify |Boolean| 是否压缩编译产物(仅在真机预览/真机调试时生效),默认为false |
**注意** **注意**
- 以上选项对应支付宝小程序内的`mini.project.json`,但是在支付宝小程序IDE启动的情况下中修改这个文件可能并不会生效,后续支付宝应该会修复这个问题 - 以上选项对应支付宝小程序内的`mini.project.json`,但是在支付宝小程序IDE启动的情况下中修改这个文件可能并不会生效,后续支付宝应该会修复这个问题
### mp-baidu ### mp-baidu
...@@ -431,19 +431,19 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置 ...@@ -431,19 +431,19 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置
+ 静态文件:分包下支持 static 等静态资源拷贝,即分包目录内放置的静态资源不会被打包到主包中,也不可在主包中使用 + 静态文件:分包下支持 static 等静态资源拷贝,即分包目录内放置的静态资源不会被打包到主包中,也不可在主包中使用
+ js文件:当某个 js 仅被一个分包引用时,该 js 会被打包到该分包内,否则仍打到主包(即被主包引用,或被超过 1 个分包引用) + js文件:当某个 js 仅被一个分包引用时,该 js 会被打包到该分包内,否则仍打到主包(即被主包引用,或被超过 1 个分包引用)
+ 自定义组件:若某个自定义组件仅被一个分包引用时,且未放入到分包内,编译时会输出提示信息 + 自定义组件:若某个自定义组件仅被一个分包引用时,且未放入到分包内,编译时会输出提示信息
**分包内静态文件示例** **分包内静态文件示例**
``` ```
"subPackages": [{ "subPackages": [{
"root": "pages/sub", "root": "pages/sub",
"pages": [{ "pages": [{
"path": "index/index" "path": "index/index"
}] }]
}] }]
``` ```
以上面的分包为例,放在每个分包root对应目录下的静态文件会被打包到此分包内。 以上面的分包为例,放在每个分包root对应目录下的静态文件会被打包到此分包内。
### 完整 manifest.json ### 完整 manifest.json
...@@ -454,7 +454,7 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置 ...@@ -454,7 +454,7 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置
"description": "应用描述", "description": "应用描述",
"versionName": "1.0.0", "versionName": "1.0.0",
"versionCode": "100", "versionCode": "100",
// app-plus 节点是 5+App 特有配置,推荐在 HBuilderX 的 manifest.json 可视化界面操作完成配置。 // app-plus 节点是 App 特有配置,推荐在 HBuilderX 的 manifest.json 可视化界面操作完成配置。
"app-plus": { "app-plus": {
// HBuilderX->manifest.json->模块权限配置 // HBuilderX->manifest.json->模块权限配置
"modules": { "modules": {
...@@ -759,7 +759,7 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置 ...@@ -759,7 +759,7 @@ mp-qq只支持自定义组件模式,不存在usingComponents配置
} }
} }
``` ```
更多配置相关的说明,请参考 [manifest.json文档说明](https://ask.dcloud.net.cn/article/94) 中的描述。可能节点的位置与普通的 5+App 有差异,请按照配置的名称进行对应。 更多配置相关的说明,请参考 [manifest.json文档说明](https://ask.dcloud.net.cn/article/94) 中的描述。可能节点的位置与普通的 App 有差异,请按照配置的名称进行对应。
# FAQ # FAQ
Q:iOS 应用调用相机等权限时,弹出的提示语如何修改? Q:iOS 应用调用相机等权限时,弹出的提示语如何修改?
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
|属性|类型|必填|描述|平台兼容| |属性|类型|必填|描述|平台兼容|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|[globalStyle](/collocation/pages?id=globalstyle)|Object|否|设置默认页面的窗口表现|| |[globalStyle](/collocation/pages?id=globalstyle)|Object|否|设置默认页面的窗口表现||
|[pages](/collocation/pages?id=pages)|Object Array|是|设置页面路径及窗口表现|| |[pages](/collocation/pages?id=pages)|Object Array|是|设置页面路径及窗口表现||
|[easycom](/collocation/pages?id=easycom)|Object|否|组件自动引入规则|2.5.0+| |[easycom](/collocation/pages?id=easycom)|Object|否|组件自动引入规则|2.5.0+|
|[tabBar](/collocation/pages?id=tabbar)|Object|否|设置底部 tab 的表现|| |[tabBar](/collocation/pages?id=tabbar)|Object|否|设置底部 tab 的表现||
|[condition](/collocation/pages?id=condition)|Object|否|启动模式配置|| |[condition](/collocation/pages?id=condition)|Object|否|启动模式配置||
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
"backgroundColor": "#F8F8F8", "backgroundColor": "#F8F8F8",
"usingComponents":{ "usingComponents":{
"collapse-tree-item":"/components/collapse-tree-item" "collapse-tree-item":"/components/collapse-tree-item"
}, },
"pageOrientation": "portrait"//横屏配置,全局屏幕旋转设置(仅 APP/微信/QQ小程序),支持 auto / portrait / landscape "pageOrientation": "portrait"//横屏配置,全局屏幕旋转设置(仅 APP/微信/QQ小程序),支持 auto / portrait / landscape
}, },
"tabBar": { "tabBar": {
...@@ -80,9 +80,9 @@ ...@@ -80,9 +80,9 @@
"iconWidth": "24px", "iconWidth": "24px",
"backgroundImage": "static/image/midButton_backgroundImage.png" "backgroundImage": "static/image/midButton_backgroundImage.png"
} }
}, },
"easycom": { "easycom": {
"uni-(.*)": "@/components/uni-$1/uni-$1.vue" "uni-(.*)": "@/components/uni-$1/uni-$1.vue"
} }
} }
``` ```
...@@ -295,7 +295,7 @@ ...@@ -295,7 +295,7 @@
- 页面支持通过配置 navigationStyle为custom,或titleNView为false,来禁用原生导航栏。一旦禁用原生导航,请注意阅读[自定义导航注意事项](/collocation/pages?id=customnav) - 页面支持通过配置 navigationStyle为custom,或titleNView为false,来禁用原生导航栏。一旦禁用原生导航,请注意阅读[自定义导航注意事项](/collocation/pages?id=customnav)
- `titleNView` 不能设置 `autoBackButton``homeButton`等属性 - `titleNView` 不能设置 `autoBackButton``homeButton`等属性
- `titleNView``type` 值为 `transparent` 时,导航栏为滚动透明渐变导航栏,默认只有button,滚动后标题栏底色和title文字会渐变出现; `type``float` 时,导航栏为悬浮标题栏,此时页面内容上顶到了屏幕顶部,包括状态栏,但导航栏悬浮盖在页面上方,一般这种场景会同时设置导航栏的背景色为rgba半透明颜色。 - `titleNView``type` 值为 `transparent` 时,导航栏为滚动透明渐变导航栏,默认只有button,滚动后标题栏底色和title文字会渐变出现; `type``float` 时,导航栏为悬浮标题栏,此时页面内容上顶到了屏幕顶部,包括状态栏,但导航栏悬浮盖在页面上方,一般这种场景会同时设置导航栏的背景色为rgba半透明颜色。
- `titleNView``type` 值为 `transparent` 时,App-nvue 2.4.4+ 支持 - `titleNView``type` 值为 `transparent` 时,App-nvue 2.4.4+ 支持
-`titleNView` 配置 `buttons` 后,监听按钮的点击事件,vue 页面及 nvue 的uni-app编译模式参考:[onNavigationBarButtonTap](/frame?id=页面生命周期)、nvue 的weex编译模式参考:[uni.onNavigationBarButtonTap](/use-weex?id=onnavigationbarbuttontap) -`titleNView` 配置 `buttons` 后,监听按钮的点击事件,vue 页面及 nvue 的uni-app编译模式参考:[onNavigationBarButtonTap](/frame?id=页面生命周期)、nvue 的weex编译模式参考:[uni.onNavigationBarButtonTap](/use-weex?id=onnavigationbarbuttontap)
-`titleNView` 配置 `searchInput` 后,相关的事件监听参考:[onNavigationBarSearchInputChanged 等](/frame?id=页面生命周期) -`titleNView` 配置 `searchInput` 后,相关的事件监听参考:[onNavigationBarSearchInputChanged 等](/frame?id=页面生命周期)
...@@ -658,23 +658,23 @@ h5 平台下拉刷新动画,只有 circle 类型。 ...@@ -658,23 +658,23 @@ h5 平台下拉刷新动画,只有 circle 类型。
## FAQ ## FAQ
- Q:如何取消原生导航栏?或自定义导航 - Q:如何取消原生导航栏?或自定义导航
- A:参考[导航栏开发指南](http://ask.dcloud.net.cn/article/34921) - A:参考[导航栏开发指南](http://ask.dcloud.net.cn/article/34921)
# easycom # easycom
`2.5.0`版本开始uni-app支持在`pages.json`内使用`easycom`以正则匹配的方式自动引入组件。 `2.5.0`版本开始uni-app支持在`pages.json`内使用`easycom`以正则匹配的方式自动引入组件。
**使用示例** **使用示例**
``` ```
"easycom": { "easycom": {
"uni-(.*)": "@/components/uni-$1/uni-$1.vue" "uni-(.*)": "@/components/uni-$1/uni-$1.vue"
} }
``` ```
**说明** **说明**
- `easycom`方式引入的组件无需在页面内`import`,也不需要在`components`内声明,即可在任意页面使用 - `easycom`方式引入的组件无需在页面内`import`,也不需要在`components`内声明,即可在任意页面使用
- `easycom`方式引入组件不是全局引入,而是局部引入。例如在H5端只有加载相应页面才会加载使用的组件 - `easycom`方式引入组件不是全局引入,而是局部引入。例如在H5端只有加载相应页面才会加载使用的组件
- 在组件名完全一致的情况下,`easycom`引入的优先级低于手动引入(区分连字符形式与驼峰形式) - 在组件名完全一致的情况下,`easycom`引入的优先级低于手动引入(区分连字符形式与驼峰形式)
- 考虑到编译速度,直接修改`easycom`不会触发重新编译,需要改动页面内容触发。 - 考虑到编译速度,直接修改`easycom`不会触发重新编译,需要改动页面内容触发。
# tabBar # tabBar
如果应用是一个多 tab 应用,可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页。 如果应用是一个多 tab 应用,可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页。
...@@ -708,7 +708,7 @@ h5 平台下拉刷新动画,只有 circle 类型。 ...@@ -708,7 +708,7 @@ h5 平台下拉刷新动画,只有 circle 类型。
|属性|类型|必填|说明| |属性|类型|必填|说明|
|:-|:-|:-|:-| |:-|:-|:-|:-|
|pagePath|String|是|页面路径,必须在 pages 中先定义| |pagePath|String|是|页面路径,必须在 pages 中先定义|
|text|String|是|tab 上按钮文字,在 5+APP 和 H5 平台为非必填。例如中间可放一个没有文字的+号图标| |text|String|是|tab 上按钮文字,在 App 和 H5 平台为非必填。例如中间可放一个没有文字的+号图标|
|iconPath|String|否|图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,当 postion 为 top 时,此参数无效,不支持网络图片,不支持字体图标| |iconPath|String|否|图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px,当 postion 为 top 时,此参数无效,不支持网络图片,不支持字体图标|
|selectedIconPath|String|否|选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px ,当 postion 为 top 时,此参数无效| |selectedIconPath|String|否|选中时的图片路径,icon 大小限制为40kb,建议尺寸为 81px * 81px ,当 postion 为 top 时,此参数无效|
...@@ -779,7 +779,7 @@ midButton没有pagePath,需监听点击事件,自行处理点击后的行为 ...@@ -779,7 +779,7 @@ midButton没有pagePath,需监听点击事件,自行处理点击后的行为
|path|String|是|启动页面路径| |path|String|是|启动页面路径|
|query|String|否|启动参数,可在页面的 [onLoad](use?id=页面生命周期) 函数里获得| |query|String|否|启动参数,可在页面的 [onLoad](use?id=页面生命周期) 函数里获得|
**注意:**5+App 里真机运行可直接打开配置的页面,微信开发者工具里需要手动改变编译模式,如下图: **注意:** 在 App 里真机运行可直接打开配置的页面,微信开发者工具里需要手动改变编译模式,如下图:
<div style="text-align:center;"> <div style="text-align:center;">
<img src="//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/condition.png" /> <img src="//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/condition.png" />
...@@ -807,7 +807,7 @@ midButton没有pagePath,需监听点击事件,自行处理点击后的行为 ...@@ -807,7 +807,7 @@ midButton没有pagePath,需监听点击事件,自行处理点击后的行为
分包加载配置 分包加载配置
**注意:**此配置为小程序的分包加载机制。在5+App里始终为整包。 **注意:**此配置为小程序的分包加载机制。在App里始终为整包。
- 微信、百度小程序每个分包的大小是2M,总体积一共不能超过8M。 - 微信、百度小程序每个分包的大小是2M,总体积一共不能超过8M。
- 支付宝小程序每个分包的大小是2M,总体积一共不能超过4M。 - 支付宝小程序每个分包的大小是2M,总体积一共不能超过4M。
...@@ -818,12 +818,12 @@ subPackages 节点接收一个数组,数组每一项都是应用的子包, ...@@ -818,12 +818,12 @@ subPackages 节点接收一个数组,数组每一项都是应用的子包,
|root|String|是|子包的根目录| |root|String|是|子包的根目录|
|pages|Array|是|子包由哪些页面组成,参数同 [pages](/collocation/pages?id=pages)| |pages|Array|是|子包由哪些页面组成,参数同 [pages](/collocation/pages?id=pages)|
**注意:** **注意:**
- ```subPackages``` 里的pages的路径是 ``root`` 下的相对路径,不是全路径。 - ```subPackages``` 里的pages的路径是 ``root`` 下的相对路径,不是全路径。
- `uni-app`内支持对微信小程序、QQ小程序、百度小程序分包优化,[关于分包优化的说明](/collocation/manifest?id=关于分包优化的说明) - `uni-app`内支持对微信小程序、QQ小程序、百度小程序分包优化,[关于分包优化的说明](/collocation/manifest?id=关于分包优化的说明)
- 针对`vendor.js`过大的情况可以使用运行时压缩代码 - 针对`vendor.js`过大的情况可以使用运行时压缩代码
+ `HBuilderX`创建的项目勾选`运行-->运行到小程序模拟器-->运行时是否压缩代码` + `HBuilderX`创建的项目勾选`运行-->运行到小程序模拟器-->运行时是否压缩代码`
+ `cli`创建的项目可以在`pacakge.json`中添加参数`--minimize`,示例:`"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize"` + `cli`创建的项目可以在`pacakge.json`中添加参数`--minimize`,示例:`"dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch --minimize"`
**使用方法:** **使用方法:**
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|x|x| |√|√|√|x|√|x|x|
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√(2.2.3+)|√|√|√|√|√| |√|√(2.2.3+)|√|√|√|√|√|
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
|平台|type 有效值| |平台|type 有效值|
|:-:|:-:| |:-:|:-:|
|5+App、H5、微信小程序、QQ小程序|success, success_no_circle, info, warn, waiting, cancel, download, search, clear| |App、H5、微信小程序、QQ小程序|success, success_no_circle, info, warn, waiting, cancel, download, search, clear|
|支付宝小程序|info, warn, waiting, cancel, download, search, clear, success, success_no_circle,loading| |支付宝小程序|info, warn, waiting, cancel, download, search, clear, success, success_no_circle,loading|
|百度小程序|success, info, warn, waiting, success_no_circle, clear, search, personal, setting, top, close, cancel, download, checkboxSelected, radioSelected, radioUnselect| |百度小程序|success, info, warn, waiting, success_no_circle, clear, search, personal, setting, top, close, cancel, download, checkboxSelected, radioSelected, radioUnselect|
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|src|String||图片资源地址|| |src|String||图片资源地址||
|mode|String|'scaleToFill'|图片裁剪、缩放的模式|<div style="width:68px;"></div>| |mode|String|'scaleToFill'|图片裁剪、缩放的模式|<div style="width:68px;"></div>|
|lazy-load|Boolean|false|图片懒加载。只针对page与scroll-view下的image有效|微信小程序、5+APP、百度小程序、头条小程序| |lazy-load|Boolean|false|图片懒加载。只针对page与scroll-view下的image有效|微信小程序、App、百度小程序、头条小程序|
|fade-show|Boolean|true|图片显示动画效果|仅App-nvue 2.3.4+ Android有效| |fade-show|Boolean|true|图片显示动画效果|仅App-nvue 2.3.4+ Android有效|
|@error|HandleEvent||当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong'}|| |@error|HandleEvent||当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong'}||
|@load|HandleEvent||当图片载入完毕时,发布到 AppService 的事件名,事件对象event.detail = {height:'图片高度px', width:'图片宽度px'}|&nbsp;| |@load|HandleEvent||当图片载入完毕时,发布到 AppService 的事件名,事件对象event.detail = {height:'图片高度px', width:'图片宽度px'}|&nbsp;|
......
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序 |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x(见下)|x|√|x|√|x|√| |x(见下)|x|√|x|√|x|√|
......
...@@ -50,7 +50,7 @@ ...@@ -50,7 +50,7 @@
|width|标注图标宽度|Number|否|默认为图片实际宽度|App-nvue 2.1.5+、微信小程序、H5、支付宝小程序、百度小程序| |width|标注图标宽度|Number|否|默认为图片实际宽度|App-nvue 2.1.5+、微信小程序、H5、支付宝小程序、百度小程序|
|height|标注图标高度|Number|否|默认为图片实际高度|App-nvue 2.1.5+、微信小程序、H5、支付宝小程序、百度小程序| |height|标注图标高度|Number|否|默认为图片实际高度|App-nvue 2.1.5+、微信小程序、H5、支付宝小程序、百度小程序|
|callout|自定义标记点上方的气泡窗口|Object|否|支持的属性见下表,可识别换行符。|App-nvue 2.1.5+| |callout|自定义标记点上方的气泡窗口|Object|否|支持的属性见下表,可识别换行符。|App-nvue 2.1.5+|
|label|为标记点旁边增加标签|Object|否|支持的属性见下表,可识别换行符。|App-nvue 2.1.5+、微信小程序、H5、5+APP、百度小程序| |label|为标记点旁边增加标签|Object|否|支持的属性见下表,可识别换行符。|App-nvue 2.1.5+、微信小程序、H5、App、百度小程序|
|anchor|经纬度在标注图标的锚点,默认底边中点|Object|否|{x, y},x表示横向(0-1),y表示竖向(0-1)。{x: .5, y: 1} 表示底边中点|App-nvue 2.1.5+、微信小程序、H5、百度小程序| |anchor|经纬度在标注图标的锚点,默认底边中点|Object|否|{x, y},x表示横向(0-1),y表示竖向(0-1)。{x: .5, y: 1} 表示底边中点|App-nvue 2.1.5+、微信小程序、H5、百度小程序|
**marker 上的气泡 callout** **marker 上的气泡 callout**
......
...@@ -34,19 +34,19 @@ ...@@ -34,19 +34,19 @@
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|direction|String|none|movable-view的移动方向,属性值有all、vertical、horizontal、none|| |direction|String|none|movable-view的移动方向,属性值有all、vertical、horizontal、none||
|inertia|Boolean|false|movable-view是否带有惯性|微信小程序、App、H5、百度小程序| |inertia|Boolean|false|movable-view是否带有惯性|微信小程序、App、H5、百度小程序|
|out-of-bounds|Boolean|false|超过可移动区域后,movable-view是否还可以移动|微信小程序、5+App、H5、百度小程序| |out-of-bounds|Boolean|false|超过可移动区域后,movable-view是否还可以移动|微信小程序、App、H5、百度小程序|
|x|Number / String||定义x轴方向的偏移,如果x的值不在可移动范围内,会自动移动到可移动范围;改变x的值会触发动画|| |x|Number / String||定义x轴方向的偏移,如果x的值不在可移动范围内,会自动移动到可移动范围;改变x的值会触发动画||
|y|Number / String||定义y轴方向的偏移,如果y的值不在可移动范围内,会自动移动到可移动范围;改变y的值会触发动画|| |y|Number / String||定义y轴方向的偏移,如果y的值不在可移动范围内,会自动移动到可移动范围;改变y的值会触发动画||
|damping|Number|20|阻尼系数,用于控制x或y改变时的动画和过界回弹的动画,值越大移动越快|微信小程序、5+App、H5、百度小程序| |damping|Number|20|阻尼系数,用于控制x或y改变时的动画和过界回弹的动画,值越大移动越快|微信小程序、App、H5、百度小程序|
|friction|Number|2|摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值|微信小程序、5+App、H5、百度小程序| |friction|Number|2|摩擦系数,用于控制惯性滑动的动画,值越大摩擦力越大,滑动越快停止;必须大于0,否则会被设置成默认值|微信小程序、App、H5、百度小程序|
|disabled|Boolean|false|是否禁用|| |disabled|Boolean|false|是否禁用||
|scale|Boolean|false|是否支持双指缩放,默认缩放手势生效区域是在movable-view内|微信小程序、5+App、H5| |scale|Boolean|false|是否支持双指缩放,默认缩放手势生效区域是在movable-view内|微信小程序、App、H5|
|scale-min|Number|0.5|定义缩放倍数最小值|微信小程序、5+App、H5| |scale-min|Number|0.5|定义缩放倍数最小值|微信小程序、App、H5|
|scale-max|Number|10|定义缩放倍数最大值|微信小程序、5+App、H5| |scale-max|Number|10|定义缩放倍数最大值|微信小程序、App、H5|
|scale-value|Number|1|定义缩放倍数,取值范围为 0.5 - 10|微信小程序、5+App、H5| |scale-value|Number|1|定义缩放倍数,取值范围为 0.5 - 10|微信小程序、App、H5|
|animation|Boolean|true|是否使用动画|微信小程序、5+App、H5、百度小程序| |animation|Boolean|true|是否使用动画|微信小程序、App、H5、百度小程序|
|@change|EventHandle||拖动过程中触发的事件,event.detail = {x: x, y: y, source: source},其中source表示产生移动的原因,值可为touch(拖动)、touch-out-of-bounds(超出移动范围)、out-of-bounds(超出移动范围后的回弹)、friction(惯性)和空字符串(setData)|| |@change|EventHandle||拖动过程中触发的事件,event.detail = {x: x, y: y, source: source},其中source表示产生移动的原因,值可为touch(拖动)、touch-out-of-bounds(超出移动范围)、out-of-bounds(超出移动范围后的回弹)、friction(惯性)和空字符串(setData)||
|@scale|EventHandle||缩放过程中触发的事件,event.detail = {x: x, y: y, scale: scale},|微信小程序、5+App、H5、百度小程序| |@scale|EventHandle||缩放过程中触发的事件,event.detail = {x: x, y: y, scale: scale},|微信小程序、App、H5、百度小程序|
除了基本事件外,movable-view提供了两个特殊事件 除了基本事件外,movable-view提供了两个特殊事件
......
...@@ -9,7 +9,7 @@ ...@@ -9,7 +9,7 @@
|url|String||应用内的跳转链接,值为相对路径或绝对路径,如:"../first/first","/pages/first/first",注意不能加 ``.vue`` 后缀|| |url|String||应用内的跳转链接,值为相对路径或绝对路径,如:"../first/first","/pages/first/first",注意不能加 ``.vue`` 后缀||
|open-type|String|navigate|跳转方式|| |open-type|String|navigate|跳转方式||
|delta|Number||当 open-type 为 'navigateBack' 时有效,表示回退的层数|| |delta|Number||当 open-type 为 'navigateBack' 时有效,表示回退的层数||
|animation-type|String|pop-in/out|当 open-type 为 navigate、navigateBack 时有效,窗口的显示/关闭动画效果,详见:[窗口动画](api/router?id=animation)|5+App| |animation-type|String|pop-in/out|当 open-type 为 navigate、navigateBack 时有效,窗口的显示/关闭动画效果,详见:[窗口动画](api/router?id=animation)|App|
|animation-duration|Number|300|当 open-type 为 navigate、navigateBack 时有效,窗口显示/关闭动画的持续时间。|App| |animation-duration|Number|300|当 open-type 为 navigate、navigateBack 时有效,窗口显示/关闭动画的持续时间。|App|
|hover-class|String|navigator-hover|指定点击时的样式类,当hover-class="none"时,没有点击态效果|| |hover-class|String|navigator-hover|指定点击时的样式类,当hover-class="none"时,没有点击态效果||
|hover-stop-propagation|Boolean|false|指定是否阻止本节点的祖先节点出现点击态|微信小程序| |hover-stop-propagation|Boolean|false|指定是否阻止本节点的祖先节点出现点击态|微信小程序|
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
**平台差异说明** **平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√| |x|x|√|x|√|x|√|
......
...@@ -64,8 +64,8 @@ ...@@ -64,8 +64,8 @@
|属性名|类型|默认值|说明|平台差异说明| |属性名|类型|默认值|说明|平台差异说明|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|value|String||表示选中的时间,格式为"hh:mm"|| |value|String||表示选中的时间,格式为"hh:mm"||
|start|String||表示有效时间范围的开始,字符串格式为"hh:mm"|5+App 不支持| |start|String||表示有效时间范围的开始,字符串格式为"hh:mm"|App 不支持|
|end|String||表示有效时间范围的结束,字符串格式为"hh:mm"|5+App 不支持| |end|String||表示有效时间范围的结束,字符串格式为"hh:mm"|App 不支持|
|@change|EventHandle||value 改变时触发 change 事件,event.detail = {value: value}|| |@change|EventHandle||value 改变时触发 change 事件,event.detail = {value: value}||
|@cancel|EventHandle||取消选择时触发|| |@cancel|EventHandle||取消选择时触发||
|disabled|Boolean|false|是否禁用|&nbsp;| |disabled|Boolean|false|是否禁用|&nbsp;|
......
...@@ -23,12 +23,12 @@ ...@@ -23,12 +23,12 @@
|acceleration|Boolean|false|当开启时,会根据滑动速度,连续滑动多屏|支付宝小程序| |acceleration|Boolean|false|当开启时,会根据滑动速度,连续滑动多屏|支付宝小程序|
|disable-programmatic-animation|Boolean|false|是否禁用代码变动触发 swiper 切换时使用动画。|支付宝小程序| |disable-programmatic-animation|Boolean|false|是否禁用代码变动触发 swiper 切换时使用动画。|支付宝小程序|
|display-multiple-items|Number|1|同时显示的滑块数量|支付宝小程序不支持| |display-multiple-items|Number|1|同时显示的滑块数量|支付宝小程序不支持|
|skip-hidden-item-layout|Boolean|false|是否跳过未显示的滑块布局,设为 true 可优化复杂情况下的滑动性能,但会丢失隐藏状态滑块的布局信息|5+App、微信小程序| |skip-hidden-item-layout|Boolean|false|是否跳过未显示的滑块布局,设为 true 可优化复杂情况下的滑动性能,但会丢失隐藏状态滑块的布局信息|App、微信小程序|
|disable-touch|Boolean|false|是否禁止用户 touch 操作|支付宝小程序| |disable-touch|Boolean|false|是否禁止用户 touch 操作|支付宝小程序|
|touchable|Boolean|true|是否监听用户的触摸事件|头条小程序| |touchable|Boolean|true|是否监听用户的触摸事件|头条小程序|
|easing-function|String|default|指定 swiper 切换缓动动画类型,有效值:default、linear、easeInCubic、easeOutCubic、easeInOutCubic|微信小程序| |easing-function|String|default|指定 swiper 切换缓动动画类型,有效值:default、linear、easeInCubic、easeOutCubic、easeInOutCubic|微信小程序|
|@change|EventHandle||current 改变时会触发 change 事件,event.detail = {current: current, source: source}|| |@change|EventHandle||current 改变时会触发 change 事件,event.detail = {current: current, source: source}||
|@transition|EventHandle||swiper-item 的位置发生改变时会触发 transition 事件,event.detail = {dx: dx, dy: dy}|5+App、H5、微信小程序、支付宝小程序、头条小程序、QQ小程序| |@transition|EventHandle||swiper-item 的位置发生改变时会触发 transition 事件,event.detail = {dx: dx, dy: dy}|App、H5、微信小程序、支付宝小程序、头条小程序、QQ小程序|
|@animationfinish|EventHandle||动画结束时会触发 animationfinish 事件,event.detail = {current: current, source: source}|头条小程序不支持| |@animationfinish|EventHandle||动画结束时会触发 animationfinish 事件,event.detail = {current: current, source: source}|头条小程序不支持|
change 事件返回 detail 中包含一个 source 字段,表示导致变更的原因,可能值如下: change 事件返回 detail 中包含一个 source 字段,表示导致变更的原因,可能值如下:
...@@ -48,7 +48,7 @@ change 事件返回 detail 中包含一个 source 字段,表示导致变更的 ...@@ -48,7 +48,7 @@ change 事件返回 detail 中包含一个 source 字段,表示导致变更的
- 注意:其中只可放置 ``<swiper-item>`` 组件,否则会导致未定义的行为。 - 注意:其中只可放置 ``<swiper-item>`` 组件,否则会导致未定义的行为。
- 如果遇到current、current-item-id属性设置不生效的问题参考:[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98) - 如果遇到current、current-item-id属性设置不生效的问题参考:[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98)
- banner图的切换效果和指示器的样式,有多种风格可自定义,可在[uni-app插件市场](https://ext.dcloud.net.cn/search?q=%E8%BD%AE%E6%92%AD)搜索 - banner图的切换效果和指示器的样式,有多种风格可自定义,可在[uni-app插件市场](https://ext.dcloud.net.cn/search?q=%E8%BD%AE%E6%92%AD)搜索
- swiper在App的vue中、百度支付宝头条QQ小程序中,不支持内嵌video、map等原生组件。在微信基础库2.4.4起和App nvue2.1.5起支持内嵌原生组件。竖向的swiper内嵌视频可实现抖音、映客等视频垂直拖动切换效果。 - swiper在App的vue中、百度支付宝头条QQ小程序中,不支持内嵌video、map等原生组件。在微信基础库2.4.4起和App nvue2.1.5起支持内嵌原生组件。竖向的swiper内嵌视频可实现抖音、映客等视频垂直拖动切换效果。
- 同时监听 change transition,开始滑动时触发transition, 放开手后,在ios平台触发顺序为 transition... change,Android/微信小程序/支付宝为 transition... change transition... - 同时监听 change transition,开始滑动时触发transition, 放开手后,在ios平台触发顺序为 transition... change,Android/微信小程序/支付宝为 transition... change transition...
#### swiper-item #### swiper-item
......
...@@ -6,8 +6,8 @@ ...@@ -6,8 +6,8 @@
|属性名 |类型 |默认值 |说明 |平台差异说明 | |属性名 |类型 |默认值 |说明 |平台差异说明 |
|:-|:- |:- |:- |:- |:- | |:-|:- |:- |:- |:- |:- |
|selectable |Boolean|false |文本是否可选 | | |selectable |Boolean|false |文本是否可选 | |
|space |String | |显示连续空格 |5+APP、H5、微信小程序 | |space |String | |显示连续空格 |App、H5、微信小程序 |
|decode |Boolean|false |是否解码 |5+APP、H5、微信小程序 | |decode |Boolean|false |是否解码 |App、H5、微信小程序 |
**space 值说明** **space 值说明**
......
...@@ -15,13 +15,13 @@ ...@@ -15,13 +15,13 @@
|focus|Boolean|false|获取焦点|| |focus|Boolean|false|获取焦点||
|auto-height|Boolean|false|是否自动增高,设置auto-height时,style.height不生效|| |auto-height|Boolean|false|是否自动增高,设置auto-height时,style.height不生效||
|fixed|Boolean|false|如果 textarea 是在一个 position:fixed 的区域,需要显示指定属性 fixed 为 true|微信小程序、百度小程序、头条小程序、QQ小程序| |fixed|Boolean|false|如果 textarea 是在一个 position:fixed 的区域,需要显示指定属性 fixed 为 true|微信小程序、百度小程序、头条小程序、QQ小程序|
|cursor-spacing|Number|0|指定光标与键盘的距离,单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离|5+App、微信小程序、百度小程序、头条小程序、QQ小程序| |cursor-spacing|Number|0|指定光标与键盘的距离,单位 px 。取 textarea 距离底部的距离和 cursor-spacing 指定的距离的最小值作为光标与键盘的距离|App、微信小程序、百度小程序、头条小程序、QQ小程序|
|cursor|Number||指定focus时的光标位置|微信小程序、5+App、H5、百度小程序、头条小程序、QQ小程序| |cursor|Number||指定focus时的光标位置|微信小程序、App、H5、百度小程序、头条小程序、QQ小程序|
|show-confirm-bar|Boolean|true|是否显示键盘上方带有”完成“按钮那一栏|微信小程序、百度小程序、QQ小程序| |show-confirm-bar|Boolean|true|是否显示键盘上方带有”完成“按钮那一栏|微信小程序、百度小程序、QQ小程序|
|selection-start|Number|-1|光标起始位置,自动聚焦时有效,需与selection-end搭配使用|微信小程序、5+App、H5、百度小程序、头条小程序、QQ小程序| |selection-start|Number|-1|光标起始位置,自动聚焦时有效,需与selection-end搭配使用|微信小程序、App、H5、百度小程序、头条小程序、QQ小程序|
|selection-end|Number|-1|光标结束位置,自动聚焦时有效,需与selection-start搭配使用|微信小程序、5+App、H5、百度小程序、头条小程序、QQ小程序| |selection-end|Number|-1|光标结束位置,自动聚焦时有效,需与selection-start搭配使用|微信小程序、App、H5、百度小程序、头条小程序、QQ小程序|
|adjust-position|Boolean|true|键盘弹起时,是否自动上推页面|5+App、微信小程序、百度小程序、QQ小程序| |adjust-position|Boolean|true|键盘弹起时,是否自动上推页面|App、微信小程序、百度小程序、QQ小程序|
|@focus|EventHandle||输入框聚焦时触发,event.detail = { value, height },height 为键盘高度|仅微信小程序、5+App(HBuilderX 2.0+ [nvue uni-app模式](http://ask.dcloud.net.cn/article/36074)) 、QQ小程序支持 height| |@focus|EventHandle||输入框聚焦时触发,event.detail = { value, height },height 为键盘高度|仅微信小程序、App(HBuilderX 2.0+ [nvue uni-app模式](http://ask.dcloud.net.cn/article/36074)) 、QQ小程序支持 height|
|@blur|EventHandle||输入框失去焦点时触发,event.detail = {value, cursor}|| |@blur|EventHandle||输入框失去焦点时触发,event.detail = {value, cursor}||
|@linechange|EventHandle||输入框行数变化时调用,event.detail = {height: 0, heightRpx: 0, lineCount: 0}|头条小程序不支持| |@linechange|EventHandle||输入框行数变化时调用,event.detail = {height: 0, heightRpx: 0, lineCount: 0}|头条小程序不支持|
|@input|EventHandle||当键盘输入时,触发 input 事件,event.detail = {value, cursor}, @input 处理函数的返回值并不会反映到 textarea 上|| |@input|EventHandle||当键盘输入时,触发 input 事件,event.detail = {value, cursor}, @input 处理函数的返回值并不会反映到 textarea 上||
......
...@@ -9,12 +9,12 @@ ...@@ -9,12 +9,12 @@
|属性名|类型|说明|平台差异说明| |属性名|类型|说明|平台差异说明|
|:-|:-|:-|:| |:-|:-|:-|:|
|src|String|webview 指向网页的链接|&nbsp;| |src|String|webview 指向网页的链接|&nbsp;|
|webview-styles|Object|webview 的样式|5+App| |webview-styles|Object|webview 的样式|App|
|@message|EventHandler|网页向应用 `postMessage` 时,会在特定时机(后退、组件销毁、分享)触发并收到消息。|H5 暂不支持| |@message|EventHandler|网页向应用 `postMessage` 时,会在特定时机(后退、组件销毁、分享)触发并收到消息。|H5 暂不支持|
**src** **src**
|来源|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序| |来源|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-|:-:|:-:|:-:|:-:|:-:|:-:|:-:| |:-|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|网络|√|√|√|√|√|√|√| |网络|√|√|√|√|√|√|√|
|本地|√|暂不支持|x|x|x|x|x| |本地|√|暂不支持|x|x|x|x|x|
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
|属性|类型|说明| |属性|类型|说明|
|:-|:-|:-| |:-|:-|:-|
|plus|Boolean|5+App| |plus|Boolean|App|
|miniprogram|Boolean|微信小程序| |miniprogram|Boolean|微信小程序|
|smartprogram|Boolean|百度小程序| |smartprogram|Boolean|百度小程序|
|miniprogram|Boolean|支付宝小程序| |miniprogram|Boolean|支付宝小程序|
...@@ -131,29 +131,29 @@ ...@@ -131,29 +131,29 @@
`<web-view>` 加载的 HTML 中,添加以下代码: `<web-view>` 加载的 HTML 中,添加以下代码:
```html ```html
<script type="text/javascript"> <script type="text/javascript">
var userAgent = navigator.userAgent; var userAgent = navigator.userAgent;
if (userAgent.indexOf('AlipayClient') > -1) { if (userAgent.indexOf('AlipayClient') > -1) {
// 支付宝小程序的 JS-SDK 防止 404 需要动态加载,如果不需要兼容支付宝小程序,则无需引用此 JS 文件。 // 支付宝小程序的 JS-SDK 防止 404 需要动态加载,如果不需要兼容支付宝小程序,则无需引用此 JS 文件。
document.writeln('<script src="https://appx/web-view.min.js"' + '>' + '<' + '/' + 'script>'); document.writeln('<script src="https://appx/web-view.min.js"' + '>' + '<' + '/' + 'script>');
} else if (/QQ/i.test(userAgent) && /miniProgram/i.test(userAgent)) { } else if (/QQ/i.test(userAgent) && /miniProgram/i.test(userAgent)) {
// QQ 小程序 // QQ 小程序
document.write('<script type="text/javascript" src="https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"><\/script>'); document.write('<script type="text/javascript" src="https://qqq.gtimg.cn/miniprogram/webview_jssdk/qqjssdk-1.0.0.js"><\/script>');
} else if (/miniProgram/i.test(userAgent)) { } else if (/miniProgram/i.test(userAgent)) {
// 微信小程序 JS-SDK 如果不需要兼容微信小程序,则无需引用此 JS 文件。 // 微信小程序 JS-SDK 如果不需要兼容微信小程序,则无需引用此 JS 文件。
document.write('<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"><\/script>'); document.write('<script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"><\/script>');
} else if (/toutiaomicroapp/i.test(userAgent)) { } else if (/toutiaomicroapp/i.test(userAgent)) {
// 头条小程序 JS-SDK 如果不需要兼容头条小程序,则无需引用此 JS 文件。 // 头条小程序 JS-SDK 如果不需要兼容头条小程序,则无需引用此 JS 文件。
document.write('<script type="text/javascript" src="https://s3.pstatp.com/toutiao/tmajssdk/jssdk-1.0.1.js"><\/script>'); document.write('<script type="text/javascript" src="https://s3.pstatp.com/toutiao/tmajssdk/jssdk-1.0.1.js"><\/script>');
} else if (/swan/i.test(userAgent)) { } else if (/swan/i.test(userAgent)) {
// 百度小程序 JS-SDK 如果不需要兼容百度小程序,则无需引用此 JS 文件。 // 百度小程序 JS-SDK 如果不需要兼容百度小程序,则无需引用此 JS 文件。
document.write('<script type="text/javascript" src="https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.18.js"><\/script>'); document.write('<script type="text/javascript" src="https://b.bdstatic.com/searchbox/icms/searchbox/js/swan-2.0.18.js"><\/script>');
} }
if (!/toutiaomicroapp/i.test(userAgent)) { if (!/toutiaomicroapp/i.test(userAgent)) {
document.querySelector('.post-message-section').style.visibility = 'visible'; document.querySelector('.post-message-section').style.visibility = 'visible';
} }
</script> </script>
<!-- uni 的 SDK --> <!-- uni 的 SDK -->
<script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script> <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>
``` ```
待触发 `UniAppJSBridgeReady` 事件后,即可调用 uni 的 API。 待触发 `UniAppJSBridgeReady` 事件后,即可调用 uni 的 API。
...@@ -264,7 +264,7 @@ web-view组件在App和小程序中层级较高,如需要在vue页面中写代 ...@@ -264,7 +264,7 @@ web-view组件在App和小程序中层级较高,如需要在vue页面中写代
- App端,web-view加载的html页面可以运行plus的api,但注意如果该页面调用了plus.key的API监听了back按键(或使用mui的封装),会造成back监听冲突。需要该html页面移除对back的监听。或按照上面的示例代码禁止网页使用plus对象 - App端,web-view加载的html页面可以运行plus的api,但注意如果该页面调用了plus.key的API监听了back按键(或使用mui的封装),会造成back监听冲突。需要该html页面移除对back的监听。或按照上面的示例代码禁止网页使用plus对象
- `uni.webview.js` 最新版地址:[https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js](https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js) - `uni.webview.js` 最新版地址:[https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js](https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js)
- 小程序平台,个人类型与海外类型的小程序使用 `web-view` 组件,提交审核时注意微信等平台是否允许使用 - 小程序平台,个人类型与海外类型的小程序使用 `web-view` 组件,提交审核时注意微信等平台是否允许使用
- 小程序平台, `src` 指向的链接需登录小程序管理后台配置域名白名单。`5+App``H5` 无此限制。 - 小程序平台, `src` 指向的链接需登录小程序管理后台配置域名白名单。`App``H5` 无此限制。
##### FAQ ##### FAQ
......
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
|有效目录|说明| |有效目录|说明|
|:-:|:-:| |:-:|:-:|
|app-plus|5+App| |app-plus|App|
|h5|H5| |h5|H5|
|mp-weixin|微信小程序| |mp-weixin|微信小程序|
|mp-alipay|支付宝小程序| |mp-alipay|支付宝小程序|
...@@ -80,17 +80,17 @@ ...@@ -80,17 +80,17 @@
|onReady|监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发||| |onReady|监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发|||
|onHide|监听页面隐藏||| |onHide|监听页面隐藏|||
|onUnload|监听页面卸载||| |onUnload|监听页面卸载|||
|onResize|监听窗口尺寸变化|5+App、微信小程序|| |onResize|监听窗口尺寸变化|App、微信小程序||
|onPullDownRefresh|监听用户下拉动作,一般用于下拉刷新,参考[示例](api/ui/pulldown)||| |onPullDownRefresh|监听用户下拉动作,一般用于下拉刷新,参考[示例](api/ui/pulldown)|||
|onReachBottom|页面上拉触底事件的处理函数||| |onReachBottom|页面上拉触底事件的处理函数|||
|onTabItemTap|点击 tab 时触发,参数为Object,具体见下方注意事项|微信小程序、百度小程序、H5、5+App(自定义组件模式)|| |onTabItemTap|点击 tab 时触发,参数为Object,具体见下方注意事项|微信小程序、百度小程序、H5、App(自定义组件模式)||
|onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序|| |onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序||
|onPageScroll|监听页面滚动,参数为Object||| |onPageScroll|监听页面滚动,参数为Object|||
|onNavigationBarButtonTap|监听原生标题栏按钮点击事件,参数为Object|5+ App、H5|| |onNavigationBarButtonTap|监听原生标题栏按钮点击事件,参数为Object|5+ App、H5||
|onBackPress|监听页面返回,返回 event = {from:backbutton、 navigateBack} ,backbutton 表示来源是左上角返回按钮或 android 返回键;navigateBack表示来源是 uni.navigateBack ;详细说明及使用:[onBackPress 详解](http://ask.dcloud.net.cn/article/35120)|5+App、H5|| |onBackPress|监听页面返回,返回 event = {from:backbutton、 navigateBack} ,backbutton 表示来源是左上角返回按钮或 android 返回键;navigateBack表示来源是 uni.navigateBack ;详细说明及使用:[onBackPress 详解](http://ask.dcloud.net.cn/article/35120)|App、H5||
|onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|5+App、H5|1.6.0| |onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|App、H5|1.6.0|
|onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件,用户点击软键盘上的“搜索”按钮时触发。|5+App、H5|1.6.0| |onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件,用户点击软键盘上的“搜索”按钮时触发。|App、H5|1.6.0|
|onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|5+App、H5|1.6.0| |onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|App、H5|1.6.0|
``onPageScroll`` 参数说明: ``onPageScroll`` 参数说明:
...@@ -324,8 +324,8 @@ rpx 是相对于基准宽度的单位,可以根据屏幕宽度进行自适应 ...@@ -324,8 +324,8 @@ rpx 是相对于基准宽度的单位,可以根据屏幕宽度进行自适应
|#id|#firstname|选择拥有 id="firstname" 的组件| |#id|#firstname|选择拥有 id="firstname" 的组件|
|element|view|选择所有 view 组件| |element|view|选择所有 view 组件|
|element, element|view, checkbox|选择所有文档的 view 组件和所有的 checkbox 组件| |element, element|view, checkbox|选择所有文档的 view 组件和所有的 checkbox 组件|
|::after|view::after|在 view 组件后边插入内容,**仅微信小程序和5+App生效**| |::after|view::after|在 view 组件后边插入内容,**仅微信小程序和App生效**|
|::before|view::before|在 view 组件前边插入内容,**仅微信小程序和5+App生效**| |::before|view::before|在 view 组件前边插入内容,**仅微信小程序和App生效**|
**注意:** **注意:**
- 在 ```uni-app``` 中不能使用 ```*``` 选择器。 - 在 ```uni-app``` 中不能使用 ```*``` 选择器。
...@@ -349,7 +349,7 @@ page { ...@@ -349,7 +349,7 @@ page {
uni-app 提供内置 CSS 变量 uni-app 提供内置 CSS 变量
|CSS变量|描述|5+App|小程序|H5| |CSS变量|描述|App|小程序|H5|
|:-|:-|:-|:-|:-| |:-|:-|:-|:-|:-|
|--status-bar-height|系统状态栏高度|[系统状态栏高度](http://www.html5plus.org/doc/zh_cn/navigator.html#plus.navigator.getStatusbarHeight)、nvue注意见下|25px|0| |--status-bar-height|系统状态栏高度|[系统状态栏高度](http://www.html5plus.org/doc/zh_cn/navigator.html#plus.navigator.getStatusbarHeight)、nvue注意见下|25px|0|
|--window-top|内容区域距离顶部的距离|0|0|NavigationBar 的高度| |--window-top|内容区域距离顶部的距离|0|0|NavigationBar 的高度|
...@@ -357,7 +357,7 @@ uni-app 提供内置 CSS 变量 ...@@ -357,7 +357,7 @@ uni-app 提供内置 CSS 变量
**注意:** **注意:**
- ``var(--status-bar-height)`` 此变量在微信小程序环境为固定 ``25px``,在 5+App 里为手机实际状态栏高度。 - ``var(--status-bar-height)`` 此变量在微信小程序环境为固定 ``25px``,在 App 里为手机实际状态栏高度。
- 当设置 ``"navigationStyle":"custom"`` 取消原生导航栏后,由于窗体为沉浸式,占据了状态栏位置。此时可以使用一个高度为 ``var(--status-bar-height)`` 的 view 放在页面顶部,避免页面内容出现在状态栏。 - 当设置 ``"navigationStyle":"custom"`` 取消原生导航栏后,由于窗体为沉浸式,占据了状态栏位置。此时可以使用一个高度为 ``var(--status-bar-height)`` 的 view 放在页面顶部,避免页面内容出现在状态栏。
- 由于在H5端,不存在原生导航栏和tabbar,也是前端div模拟。如果设置了一个固定位置的居底view,在小程序和App端是在tabbar上方,但在H5端会与tabbar重叠。此时可使用`--window-bottom`,不管在哪个端,都是固定在tabbar上方。 - 由于在H5端,不存在原生导航栏和tabbar,也是前端div模拟。如果设置了一个固定位置的居底view,在小程序和App端是在tabbar上方,但在H5端会与tabbar重叠。此时可使用`--window-bottom`,不管在哪个端,都是固定在tabbar上方。
- 目前 nvue 在App端,还不支持 `--status-bar-height`变量,替代方案是在页面onLoad时通过uni.getSystemInfoSync().statusBarHeight获取状态栏高度,然后通过style绑定方式给占位view设定高度。下方提供了示例代码 - 目前 nvue 在App端,还不支持 `--status-bar-height`变量,替代方案是在页面onLoad时通过uni.getSystemInfoSync().statusBarHeight获取状态栏高度,然后通过style绑定方式给占位view设定高度。下方提供了示例代码
......
...@@ -31,7 +31,7 @@ Android上小程序大多自带了一个几十M的chromium webview,而App端 ...@@ -31,7 +31,7 @@ Android上小程序大多自带了一个几十M的chromium webview,而App端
逻辑层和视图层分离,好处是js运算不卡渲染,最简单直接的感受就是:窗体动画稳。 逻辑层和视图层分离,好处是js运算不卡渲染,最简单直接的感受就是:窗体动画稳。
如果开发者使用过5+App,应该有概念,webview新窗体一边做进入动画,一边自身渲染,很容易卡动画。而uni-app则无需写预载代码,新窗体渲染快且动画稳定。 如果开发者使用过App,应该有概念,webview新窗体一边做进入动画,一边自身渲染,很容易卡动画。而uni-app则无需写预载代码,新窗体渲染快且动画稳定。
但是两层分离也带来一个坏处,这两层互相通信,其实是有损耗的。 但是两层分离也带来一个坏处,这两层互相通信,其实是有损耗的。
......
...@@ -2,158 +2,158 @@ ...@@ -2,158 +2,158 @@
uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。 uni-app 已将常用的组件、JS API 封装到框架中,开发者按照 uni-app 规范开发即可保证多平台兼容,大部分业务均可直接满足。
但每个平台有自己的一些特性,因此会存在一些无法跨平台的情况。 但每个平台有自己的一些特性,因此会存在一些无法跨平台的情况。
- 大量写 if else,会造成代码执行性能低下和管理混乱。 - 大量写 if else,会造成代码执行性能低下和管理混乱。
- 编译到不同的工程后二次修改,会让后续升级变的很麻烦。 - 编译到不同的工程后二次修改,会让后续升级变的很麻烦。
在 C 语言中,通过 #ifdef、#ifndef 的方式,为 windows、mac 等不同 os 编译不同的代码。 在 C 语言中,通过 #ifdef、#ifndef 的方式,为 windows、mac 等不同 os 编译不同的代码。
``uni-app`` 参考这个思路,为 ``uni-app`` 提供了条件编译手段,在一个工程里优雅的完成了平台个性化实现。 ``uni-app`` 参考这个思路,为 ``uni-app`` 提供了条件编译手段,在一个工程里优雅的完成了平台个性化实现。
## 条件编译 ## 条件编译
条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。 条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。
**写法:**<span style="color:#859900;"> #ifdef</span><span style="color:#859900;"> #ifndef</span><b style="color:#268BD2"> %PLATFORM%</b> 开头,以 <span style="color:#859900;">#endif</span> 结尾。 **写法:**<span style="color:#859900;"> #ifdef</span><span style="color:#859900;"> #ifndef</span><b style="color:#268BD2"> %PLATFORM%</b> 开头,以 <span style="color:#859900;">#endif</span> 结尾。
* <span style="color:#859900;"> #ifdef</span>:if defined 仅在某平台存在 * <span style="color:#859900;"> #ifdef</span>:if defined 仅在某平台存在
* <span style="color:#859900;"> #ifndef</span>:if not defined 除了某平台均存在 * <span style="color:#859900;"> #ifndef</span>:if not defined 除了某平台均存在
* <b style="color:#268BD2"> %PLATFORM%</b>:平台名称 * <b style="color:#268BD2"> %PLATFORM%</b>:平台名称
<table><thead><tr><th>条件编译写法</th><th>说明</th></tr></thead><tbody><tr><td><div class="code"><span class="token comment"><span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> APP-PLUS</b></span><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>仅出现在 5+App 平台下的代码</td></tr><tr><td><div class="code"><span class="token comment"> <span style="color:#859900;"> #ifndef</span><b style="color:#268BD2"> H5</b></span><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>除了 H5 平台,其它平台均存在的代码</td></tr><tr><td><div class="code"><span class="token comment"> <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> H5</b></span><span style="color:#859900;"> || </span><b style="color:#268BD2">MP-WEIXIN</b><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>仅在 H5 平台或微信小程序平台存在的代码</td></tr></tbody></table> <table><thead><tr><th>条件编译写法</th><th>说明</th></tr></thead><tbody><tr><td><div class="code"><span class="token comment"><span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> APP-PLUS</b></span><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>仅出现在 App 平台下的代码</td></tr><tr><td><div class="code"><span class="token comment"> <span style="color:#859900;"> #ifndef</span><b style="color:#268BD2"> H5</b></span><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>除了 H5 平台,其它平台均存在的代码</td></tr><tr><td><div class="code"><span class="token comment"> <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> H5</b></span><span style="color:#859900;"> || </span><b style="color:#268BD2">MP-WEIXIN</b><br>需条件编译的代码<br><span class="token comment"> <span style="color:#859900;"> #endif</span></span></div></td><td>仅在 H5 平台或微信小程序平台存在的代码</td></tr></tbody></table>
<b style="color:#268BD2"> %PLATFORM%</b> **可取值如下:** <b style="color:#268BD2"> %PLATFORM%</b> **可取值如下:**
|值|平台|参考文档| |值|平台|参考文档|
|:-|:-|:-| |:-|:-|:-|
|APP-PLUS|5+App|[HTML5+ 规范](http://www.html5plus.org/doc/)| |APP-PLUS|App|[HTML5+ 规范](http://www.html5plus.org/doc/)|
|APP-PLUS-NVUE|5+App nvue|[Weex 规范](https://weex.apache.org/cn/guide/)| |APP-PLUS-NVUE|App nvue|[Weex 规范](https://weex.apache.org/cn/guide/)|
|H5|H5|| |H5|H5||
|MP-WEIXIN|微信小程序|[微信小程序](https://developers.weixin.qq.com/miniprogram/dev/api/)| |MP-WEIXIN|微信小程序|[微信小程序](https://developers.weixin.qq.com/miniprogram/dev/api/)|
|MP-ALIPAY|支付宝小程序|[支付宝小程序](https://docs.alipay.com/mini/developer/getting-started)| |MP-ALIPAY|支付宝小程序|[支付宝小程序](https://docs.alipay.com/mini/developer/getting-started)|
|MP-BAIDU|百度小程序|[百度小程序](https://smartprogram.baidu.com/docs/develop/tutorial/codedir/)| |MP-BAIDU|百度小程序|[百度小程序](https://smartprogram.baidu.com/docs/develop/tutorial/codedir/)|
|MP-TOUTIAO|头条小程序|[头条小程序](https://developer.toutiao.com/dev/cn/mini-app/develop/framework/basic-reference/introduction)| |MP-TOUTIAO|头条小程序|[头条小程序](https://developer.toutiao.com/dev/cn/mini-app/develop/framework/basic-reference/introduction)|
|MP-QQ|QQ小程序| (目前仅cli版支持)| |MP-QQ|QQ小程序| (目前仅cli版支持)|
|MP|微信小程序/支付宝小程序/百度小程序/头条小程序/QQ小程序|&nbsp;| |MP|微信小程序/支付宝小程序/百度小程序/头条小程序/QQ小程序|&nbsp;|
**支持的文件** **支持的文件**
* .vue * .vue
* .js * .js
* .css * .css
* pages.json * pages.json
* 各预编译语言文件,如:.scss、.less、.stylus、.ts、.pug * 各预编译语言文件,如:.scss、.less、.stylus、.ts、.pug
**注意:** 条件编译是利用注释实现的,在不同语法里注释写法不一样,js使用 ``// 注释``、css 使用 ``/* 注释 */``、vue/nvue 模板里使用 ``<!-- 注释 -->`` **注意:** 条件编译是利用注释实现的,在不同语法里注释写法不一样,js使用 ``// 注释``、css 使用 ``/* 注释 */``、vue/nvue 模板里使用 ``<!-- 注释 -->``
### API 的条件编译 ### API 的条件编译
<pre v-pre="" data-lang="javascript"><code class="lang-javascript code"><span class="token comment">//<span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM%</b></span> <pre v-pre="" data-lang="javascript"><code class="lang-javascript code"><span class="token comment">//<span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM%</b></span>
平台特有的API实现 平台特有的API实现
<span class="token comment">//<span style="color:#859900;"> #endif</span></span></code></pre> <span class="token comment">//<span style="color:#859900;"> #endif</span></span></code></pre>
示例,如下代码仅在 5+App 下出现: 示例,如下代码仅在 App 下出现:
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-7.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-7.png)
示例,如下代码不会在 H5 平台上出现: 示例,如下代码不会在 H5 平台上出现:
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-6.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-6.png)
除了支持单个平台的条件编译外,还支持**多平台**同时编译,使用 || 来分隔平台名称。 除了支持单个平台的条件编译外,还支持**多平台**同时编译,使用 || 来分隔平台名称。
示例,如下代码会在 5+App 和 H5 平台上出现: 示例,如下代码会在 App 和 H5 平台上出现:
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-5.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-5.png)
### 组件的条件编译 ### 组件的条件编译
<pre v-pre="" data-lang="html"><code class="lang-html code"><span class="token comment">&lt;!-- <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM%</b> --&gt;</span> <pre v-pre="" data-lang="html"><code class="lang-html code"><span class="token comment">&lt;!-- <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM%</b> --&gt;</span>
平台特有的组件 平台特有的组件
<span class="token comment">&lt;!-- <span style="color:#859900;"> #endif</span> --&gt;</span></code></pre> <span class="token comment">&lt;!-- <span style="color:#859900;"> #endif</span> --&gt;</span></code></pre>
示例,如下广告组件仅会在微信小程序中出现: 示例,如下广告组件仅会在微信小程序中出现:
![uniapp](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-1.1.png) ![uniapp](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-1.1.png)
### 样式的条件编译 ### 样式的条件编译
<pre v-pre="" data-lang="css"><code class="lang-css code"><span class="token comment">/* <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM% </b> */</span> <pre v-pre="" data-lang="css"><code class="lang-css code"><span class="token comment">/* <span style="color:#859900;"> #ifdef</span><b style="color:#268BD2"> %PLATFORM% </b> */</span>
平台特有样式 平台特有样式
<span class="token comment">/* <span style="color:#859900;"> #endif </span> */</span></code></pre> <span class="token comment">/* <span style="color:#859900;"> #endif </span> */</span></code></pre>
**注意:** 样式的条件编译,无论是 css 还是 sass/scss/less/stylus 等预编译语言中,必须使用 `/*注释*/` 的写法。 **注意:** 样式的条件编译,无论是 css 还是 sass/scss/less/stylus 等预编译语言中,必须使用 `/*注释*/` 的写法。
正确写法 正确写法
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-2.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-2.png)
错误写法 错误写法
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-3.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-3.png)
### pages.json 的条件编译 ### pages.json 的条件编译
下面的页面,只有运行至 5+App 时才会编译进去。 下面的页面,只有运行至 App 时才会编译进去。
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-4.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/platform-4.png)
不同平台下的特有功能,以及小程序平台的分包,都可以通过 pages.json 的条件编译来更好地实现。这样,就不会在其它平台产生多余的资源,进而减小包体积。 不同平台下的特有功能,以及小程序平台的分包,都可以通过 pages.json 的条件编译来更好地实现。这样,就不会在其它平台产生多余的资源,进而减小包体积。
json的条件编译,如不同平台的key名称相同,cli项目下开发者自己安装的校验器会报错,需自行关闭这些校验器对json相同key的校验规则。如果使用HBuilderX的校验器,无需在意此问题,HBuilderX的语法校验器为此优化过。 json的条件编译,如不同平台的key名称相同,cli项目下开发者自己安装的校验器会报错,需自行关闭这些校验器对json相同key的校验规则。如果使用HBuilderX的校验器,无需在意此问题,HBuilderX的语法校验器为此优化过。
### static 目录的条件编译 ### static 目录的条件编译
在不同平台,引用的静态资源可能也存在差异,通过 static 的的条件编译可以解决此问题,static 目录下新建不同平台的专有目录(目录名称同 `%PLATFORM%` 值域,但字母均为小写),专有目录下的静态资源只有在特定平台才会编译进去。 在不同平台,引用的静态资源可能也存在差异,通过 static 的的条件编译可以解决此问题,static 目录下新建不同平台的专有目录(目录名称同 `%PLATFORM%` 值域,但字母均为小写),专有目录下的静态资源只有在特定平台才会编译进去。
如以下目录结构,``a.png`` 只有在微信小程序平台才会编译进去,``b.png`` 在所有平台都会被编译。 如以下目录结构,``a.png`` 只有在微信小程序平台才会编译进去,``b.png`` 在所有平台都会被编译。
<pre v-pre="" data-lang=""> <pre v-pre="" data-lang="">
<code class="lang-" style="padding:0"> <code class="lang-" style="padding:0">
┌─static ┌─static
│ ├─mp-weixin │ ├─mp-weixin
│ │ └─a.png │ │ └─a.png
│ └─b.png │ └─b.png
├─main.js ├─main.js
├─App.vue ├─App.vue
├─manifest.json ├─manifest.json
└─pages.json └─pages.json
</code> </code>
</pre> </pre>
### 整体目录条件编译 ### 整体目录条件编译
如果想把各平台的页面文件更彻底的分开,也可以在uni-app项目根目录创建`platforms`目录,然后在下面进一步创建APP-PLUS、MP-WEIXIN等子目录,存放不同平台的文件。 如果想把各平台的页面文件更彻底的分开,也可以在uni-app项目根目录创建`platforms`目录,然后在下面进一步创建APP-PLUS、MP-WEIXIN等子目录,存放不同平台的文件。
### HBuilderX 支持 ### HBuilderX 支持
HBuilderX 为 ``uni-app`` 的条件编译提供了丰富的支持: HBuilderX 为 ``uni-app`` 的条件编译提供了丰富的支持:
**代码块支持** **代码块支持**
在 HBuilderX 中开发 ``uni-app`` 时,通过输入 **ifdef** 可快速生成条件编译的代码片段 在 HBuilderX 中开发 ``uni-app`` 时,通过输入 **ifdef** 可快速生成条件编译的代码片段
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-022402.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-022402.png)
**语法高亮** **语法高亮**
在 HBuilderX 中对条件编译的代码注释部分提供了语法高亮,可分辨出写法是否正确,使得代码更加清晰(独立js文件需在编辑器右下角切换javascript es6+编辑器,独立css文件暂不支持高亮,但不高亮不影响使用) 在 HBuilderX 中对条件编译的代码注释部分提供了语法高亮,可分辨出写法是否正确,使得代码更加清晰(独立js文件需在编辑器右下角切换javascript es6+编辑器,独立css文件暂不支持高亮,但不高亮不影响使用)
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-012403.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-012403.png)
**正确注释和快速选中** **正确注释和快速选中**
在 HBuilderX 中,ctrl+alt+/ 即可生成正确注释(js:``// 注释``、css:``/* 注释 */``、vue/nvue模板: ``<!-- 注释 -->``)。 在 HBuilderX 中,ctrl+alt+/ 即可生成正确注释(js:``// 注释``、css:``/* 注释 */``、vue/nvue模板: ``<!-- 注释 -->``)。
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni2019012801.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni2019012801.png)
点击 **ifdef****endif** 可快速选中条件编译部分;点击左侧的折叠图标,可折叠条件编译部分代码。 点击 **ifdef****endif** 可快速选中条件编译部分;点击左侧的折叠图标,可折叠条件编译部分代码。
![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-012501.png) ![](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/uni-012501.png)
### 注意 ### 注意
* Android 和 iOS 平台不支持通过条件编译来区分,如果需要区分 Android、iOS 平台,请通过调用 uni.getSystemInfo 来获取平台信息。在HBuilderX1.9.10起,支持`ifios``ifAndroid`代码块,可方便编写判断。 * Android 和 iOS 平台不支持通过条件编译来区分,如果需要区分 Android、iOS 平台,请通过调用 uni.getSystemInfo 来获取平台信息。在HBuilderX1.9.10起,支持`ifios``ifAndroid`代码块,可方便编写判断。
* 有些跨端工具可以提供js的条件编译或多态,但这对于实际开发远远不够。uni-app不止是处理js,任何代码都可以多端条件编译,才能真正解决实际项目的跨端问题。另外所谓多态在实际开发中会造成大量冗余代码,很不利于复用和维护。举例,微信小程序主题色是绿色,而百度支付宝小程序是蓝色,你的应用想分平台适配颜色,只有条件编译是代码量最低、最容易维护的。 * 有些跨端工具可以提供js的条件编译或多态,但这对于实际开发远远不够。uni-app不止是处理js,任何代码都可以多端条件编译,才能真正解决实际项目的跨端问题。另外所谓多态在实际开发中会造成大量冗余代码,很不利于复用和维护。举例,微信小程序主题色是绿色,而百度支付宝小程序是蓝色,你的应用想分平台适配颜色,只有条件编译是代码量最低、最容易维护的。
* 有些公司的产品运营总是给不同平台提不同需求,但这不是拒绝uni-app的理由。关键在于项目里,复用的代码多还是个性的代码多,正常都是复用的代码多,所以仍然应该多端。而个性的代码放到不同平台的目录下,差异化维护。 * 有些公司的产品运营总是给不同平台提不同需求,但这不是拒绝uni-app的理由。关键在于项目里,复用的代码多还是个性的代码多,正常都是复用的代码多,所以仍然应该多端。而个性的代码放到不同平台的目录下,差异化维护。
\ No newline at end of file
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
**uni-app收费吗?** **uni-app收费吗?**
```uni-app``` 是免费并且属于Apache2.0开源协议的产品。DCloud官方承诺永远不会变更开源协议。无论HBuilderX、uni-app、5+app,面向中国人永久免费。大家可以放心使用。 ```uni-app``` 是免费并且属于Apache2.0开源协议的产品。DCloud官方承诺永远不会变更开源协议。无论HBuilderX、uni-app、App,面向中国人永久免费。大家可以放心使用。
DCloud的盈利方式在帮助开发者进行推广和流量变现上,而不在开发工具收费上。 DCloud的盈利方式在帮助开发者进行推广和流量变现上,而不在开发工具收费上。
......
...@@ -173,7 +173,7 @@ Tip ...@@ -173,7 +173,7 @@ Tip
- 常用的开发模式就是`pc`上使用内置浏览器预览调dom,运行到真机上看`console.log`。如果是很复杂的问题才使用`debug`。 - 常用的开发模式就是`pc`上使用内置浏览器预览调dom,运行到真机上看`console.log`。如果是很复杂的问题才使用`debug`。
- vue页面也可以在微信开发者工具里调试,除了plus API,其他是一样的,微信开发者工具的查看`Dom`和网络和存储等调试工具相对而言更完善些。 - vue页面也可以在微信开发者工具里调试,除了plus API,其他是一样的,微信开发者工具的查看`Dom`和网络和存储等调试工具相对而言更完善些。
注意:即使不发布微信小程序、只发布`App`,也需要安装微信开发者工具。 注意:即使不发布微信小程序、只发布`App`,也需要安装微信开发者工具。
- uni-app的App端没有5+App那种webkit remote debug,因为uni-app的js不是运行在webview里,而是独立的jscore里。 - uni-app的App端没有App那种webkit remote debug,因为uni-app的js不是运行在webview里,而是独立的jscore里。
- 部分manifest配置,如三方sdk配置,需要打包后生效的,可以打包一个自定义运行基座。打包自定义基座后运行这个自定义基座,同样可以真机运行和debug。打包正式包将无法真机运行和debug。 - 部分manifest配置,如三方sdk配置,需要打包后生效的,可以打包一个自定义运行基座。打包自定义基座后运行这个自定义基座,同样可以真机运行和debug。打包正式包将无法真机运行和debug。
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
"description" : "A uni-app project", "description" : "A uni-app project",
"versionName" : "1.0.0", "versionName" : "1.0.0",
"versionCode" : "100", "versionCode" : "100",
"app-plus" : {/* 5+App特有相关 */ "app-plus" : {/* App特有相关 */
"modules" : {/* 模块配置 */ "modules" : {/* 模块配置 */
}, },
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
"versionName": "1.0.0", "versionName": "1.0.0",
"versionCode": "100", "versionCode": "100",
"transformPx":false, "transformPx":false,
"app-plus": { /* 5+App特有相关 */ "app-plus": { /* App特有相关 */
"modules": { /* 模块配置 */ "modules": { /* 模块配置 */
}, },
...@@ -52,4 +52,4 @@ ...@@ -52,4 +52,4 @@
"urlCheck" : true "urlCheck" : true
} }
} }
} }
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册