Skip to content

U
uni-app

tomleePHP / uni-app
与 Fork 源项目一致

Fork自 DCloud / uni-app

通知 1
Star 1
Fork 0
U
uni-app

体验新版 GitCode，发现更多精彩内容 >>

提交 f51b016b 编写于 作者: fxy060608's avatar fxy060608
浏览文件
操作

Merge branch 'dev' of https://github.com/dcloudio/uni-app into alpha

上级 dec383e0 b8c3e92a
隐藏空白更改
内联 并排
Showing with 1862 addition and 868 deletion
README.md
浏览文件 @ f51b016b
......@@ -18,7 +18,7 @@
<img src="https://img-cdn-qiniu.dcloud.net.cn/uni-app-qr-all.jpg"/>
*注： Appstore、百度、头条平台不能提交简单demo，故iOS、百度小程序、头条小程序版补充了一些其他功能。*
*注： 某些平台不能提交简单demo，补充了一些其他功能。*
## 快速开始
......
docs/README.md
浏览文件 @ f51b016b
......@@ -3,7 +3,7 @@
即使不跨端，```uni-app```同时也是更好的小程序开发框架。详见[评测](https://ask.dcloud.net.cn/article/35947)
`DCloud`公司拥有340万开发者用户，旗下```uni-app```有5万+案例、600+插件、50+微信/qq群、更高的百度指数，可以放心选择。
`DCloud`公司拥有350万开发者用户，旗下```uni-app```有5万+案例、600+插件、50+微信/qq群、更高的百度指数，可以放心选择。
<div class="quick">
<h3 id="快速体验"><a href="/README?id=%e5%bf%ab%e9%80%9f%e4%bd%93%e9%aa%8c" data-id="快速体验" class="anchor"><span>快速体验</span></a></h3>
......@@ -41,19 +41,19 @@
</a>
<a href="//m3w.cn/uniapp" target="_blank" class="clear-style barcode-view">
<div class="barcode-img-box">
<img src="http://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/mp-toutiao.png" width="160"/>
<img src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/mp-toutiao.png" width="160"/>
</div>
<b>头条小程序版</b>
</a>
<a href="//m3w.cn/uniapp" target="_blank" class="clear-style barcode-view">
<div class="barcode-img-box">
<img src="http://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/hello-uni-qq.png" width="160"/>
<img src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/hello-uni-qq.png" width="160"/>
</div>
<b>QQ小程序版</b>
</a>
</div>
<p>
<em>注：Appstore、百度、头条平台不能提交简单demo，故补充了一些其他功能。</em></br>
<em>注：某些平台不能提交简单demo，故补充了一些其他功能；hello uni-app示例代码可从[github](https://github.com/dcloudio/hello-uniapp)获取</em></br>
</p>
</div>
......
docs/_sidebar.md
浏览文件 @ f51b016b
......@@ -16,7 +16,7 @@
* [从其他项目转uni-app](translate.md)
* [选型评估指南](select.md)
* [常见问题](faq.md)
* [更新日志](//uniapp.dcloud.io/release)
* [更新日志](release.md)
<!-- * [更新日志](//update.dcloud.net.cn/hbuilderx/changelog/2.1.1.20190716.html) -->
<!-- <li><a id="update-hock" href="javascript:;" target="__blank">更新日志</a></li> -->
<li class="show-sponsor-in-phone show-last"><a href="//ext.dcloud.net.cn/" target="__blank">插件市场</a></li>
......
docs/api/README.md
浏览文件 @ f51b016b
框架提供丰富的 API，可以方便的调起客户端提供的能力，如获取用户信息，本地存储，支付功能等。
`uni-app`的js API由标准ECMAScript的js API 和 uni 扩展 API 这两部分组成。
JS API命名与小程序相同。各端受自身限制，可能某些API无法使用，具体见每个API的兼容性说明。
标准ecmascript的API非常多，本文档没有必要列全，仅以console、settimeout为例做简要说明。扩展 API 命名与小程序相同。
## 标准js和浏览器js的区别
`uni-app`的js代码，h5端运行于浏览器中。非h5端，Android平台运行在v8引擎中，iOS平台运行在iOS自带的jscore引擎中。
非H5端，虽然不支持window、document、navigator等浏览器的js API，但也支持标准ECMAScript。
开发者不要把浏览器里的js等价于标准js。
ECMAScript由Ecma国际管理，是基础js语法。浏览器基于标准js扩充了window、document等js API；Node.js基于标准js扩充了fs等模块；小程序也基于标准js扩展了各种wx.xx、my.xx、swan.xx的API。
所以uni-app的非H5端，一样支持标准js，支持if、for等语法，支持字符串、数组、时间等变量及各种处理方法。仅仅是不支持浏览器专用对象。
## 各端特色API调用
除了uni-app框架内置的跨端API，各端自己的特色API也可通过[条件编译](https://uniapp.dcloud.io/platform)自由使用。
各端特色API规范参考各端的开发文档。其中App端的JS API参考[html5plus.org](https://www.html5plus.org/doc/h5p.html)；uni-app也支持通过扩展原生插件来丰富App端的开发能力，具体参考[插件开发文档](http://ask.dcloud.net.cn/article/35408)
各平台的API新增，不需要uni-app升级，开发者就可以直接使用。
## 说明
- uni.on 开头的 API 是监听某个事件发生的 API 接口，接受一个 CALLBACK 函数作为参数。当该事件触发时，会调用 CALLBACK 函数。
......
docs/api/_sidebar.md
浏览文件 @ f51b016b
* 基础
* [日志打印](api/log.md)
* [定时器](api/timer.md)
* [uni.base64ToArrayBuffer](api/base64ToArrayBuffer?id=base64toarraybuffer)
* [uni.arrayBufferToBase64](api/arrayBufferToBase64?id=arraybuffertobase64)
* [定时器](api/timer.md)
* [生命周期](api/lifetime.md)
* [生命周期](api/lifecycle.md)
* 网络
* [发起请求](api/request/request.md)
* [上传、下载](api/request/network-file.md)
......@@ -64,7 +64,7 @@
* [电量](api/system/batteryInfo.md)
* [NFC](api/system/nfc.md)
* [设备方向](api/system/deviceMotion.md)
* [Worker](api/worder.md)
* [Worker](api/worker.md)
* 键盘
* [uni.hideKeyboard](/api/key?id=hidekeyboard)
* [uni.onKeyboardHeightChange](/api/key?id=onkeyboardheightchange)
......
docs/api/arrayBufferToBase64.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|
......
docs/api/base64ToArrayBuffer.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|
......
docs/api/canvas/CanvasContext.md
浏览文件 @ f51b016b
......@@ -2,9 +2,11 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|x|√|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|√|√|
App-nvue下如需使用canvas，暂未封装为uni API，可参考[文档](https://github.com/dcloudio/NvueCanvasDemo)使用。
### CanvasContext.fillStyle string
......
docs/api/file/file.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**注意：saveFile 会把临时文件移动，因此调用成功后传入的 tempFilePath 将不可用。**
......@@ -45,9 +45,9 @@ uni.chooseImage({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**OBJECT 参数说明：**
......@@ -87,9 +87,9 @@ uni.getSavedFileList({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|√|
**OBJECT 参数说明：**
......@@ -125,9 +125,9 @@ uni.getSavedFileInfo({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**OBJECT 参数说明：**
......@@ -160,9 +160,9 @@ uni.getSavedFileList({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**OBJECT 参数说明：**
......@@ -187,9 +187,9 @@ uni.getSavedFileList({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**OBJECT 参数说明：**
......
docs/api/file/getFileSystemManager.md
浏览文件 @ f51b016b
......@@ -3,4 +3,6 @@
获取全局唯一的文件管理器
仅微信小程序平台支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.getFileSystemManager.html)
\ No newline at end of file
- 微信小程序平台，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.getFileSystemManager.html)
- 头条小程序平台，[规范详情](https://developer.toutiao.com/docs/api/getFileSystemManager.html)
- QQ小程序平台，[规范详情](https://q.qq.com/wiki/develop/miniprogram/API/file/qq.getFileSystemManager.html)
\ No newline at end of file
docs/api/key.md
浏览文件 @ f51b016b
......@@ -6,7 +6,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|x|√|√|
......@@ -17,7 +17,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|HBuilderX 2.2.3+|x|基础库2.7+|x|x|x|√|
......
docs/api/lifetime.md → docs/api/lifecycle.md
浏览文件 @ f51b016b
### 应用生命周期
``uni-app`` 支持如下应用生命周期函数：
|函数名|说明|
|:-|:-|
|onLaunch|当``uni-app`` 初始化完成时触发（全局只触发一次）|
|onShow|当 ``uni-app`` 启动，或从后台进入前台显示|
|onHide|当 ``uni-app`` 从前台进入后台|
|onUniNViewMessage|对 ``nvue`` 页面发送的数据进行监听，可参考 [nvue 向 vue 通讯](/use-weex?id=nvue-向-vue-通讯)|
**注意**
- 应用生命周期仅可在``App.vue``中监听，在其它页面监听无效。
- onlaunch里进行页面跳转，如遇白屏报错，请参考[https://ask.dcloud.net.cn/article/35942](https://ask.dcloud.net.cn/article/35942)
### 页面生命周期
``uni-app`` 支持如下页面生命周期函数：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|onLoad|监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参），参考[示例](/api/router?id=navigateto)|||
|onShow|监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面|||
|onReady|监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发|||
|onHide|监听页面隐藏|||
|onUnload|监听页面卸载|||
|onResize|监听窗口尺寸变化|5+App、微信小程序||
|onPullDownRefresh|监听用户下拉动作，一般用于下拉刷新，参考[示例](api/ui/pulldown)|||
|onReachBottom|页面滚动到底部的事件（不是scroll-view滚到底），常用于上拉加载下一页数据。如使用scroll-view导致页面级没有滚动，则触底事件不会被触发|||
|onTabItemTap|点击 tab 时触发，参数为Object，具体见下方注意事项|微信小程序、百度小程序、H5、5+App（自定义组件模式）||
|onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序||
|onPageScroll|监听页面滚动，参数为Object|||
|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||
|onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|5+App、H5|1.6.0|
|onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。|5+App、H5|1.6.0|
|onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|5+App、H5|1.6.0|
``onPageScroll`` 参数说明：
|属性|类型|说明|
|---|---|---|
|scrollTop|Number|页面在垂直方向已滚动的距离（单位px）|
``onTabItemTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|String|被点击tabItem的序号，从0开始|
|pagePath|String|被点击tabItem的页面路径|
|text|String|被点击tabItem的按钮文字|
**注意**
- onTabItemTap常用于点击当前tabitem，滚动或刷新当前页面。如果是点击不同的tabitem，一定会触发页面切换。
- 如果想在App端实现点击某个tabitem不跳转页面，不能使用onTabItemTap，可以使用[plus.nativeObj.view](http://www.html5plus.org/doc/zh_cn/nativeobj.html)放一个区块盖住原先的tabitem，并拦截点击事件。
- onTabItemTap在App端，从HBuilderX 1.9 的自定义组件编译模式开始支持。
``onNavigationBarButtonTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|Number|原生标题栏按钮数组的下标|
`onBackPress` 回调参数对象说明：
|属性|类型|说明|
|---|---|---|
|from|String|触发返回行为的来源：'backbutton'——左上角导航栏按钮及安卓返回键；'navigateBack'——uni.navigateBack() 方法。|
```javascript
export default {
data() {
return {};
},
onBackPress(options) {
console.log('from:' + options.from)
}
}
```
**注意**
- nvue 页面支持的生命周期参考：[nvue 生命周期介绍](/use-weex?id=生命周期)。
### 应用生命周期
``uni-app`` 支持如下应用生命周期函数：
|函数名|说明|
|:-|:-|
|onLaunch|当``uni-app`` 初始化完成时触发（全局只触发一次）|
|onShow|当 ``uni-app`` 启动，或从后台进入前台显示|
|onHide|当 ``uni-app`` 从前台进入后台|
|onUniNViewMessage|对 ``nvue`` 页面发送的数据进行监听，可参考 [nvue 向 vue 通讯](/use-weex?id=nvue-向-vue-通讯)|
**注意**
- 应用生命周期仅可在``App.vue``中监听，在其它页面监听无效。
- onlaunch里进行页面跳转，如遇白屏报错，请参考[https://ask.dcloud.net.cn/article/35942](https://ask.dcloud.net.cn/article/35942)
### 页面生命周期
``uni-app`` 支持如下页面生命周期函数：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|onLoad|监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参），参考[示例](/api/router?id=navigateto)|||
|onShow|监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面|||
|onReady|监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发|||
|onHide|监听页面隐藏|||
|onUnload|监听页面卸载|||
|onResize|监听窗口尺寸变化|App、微信小程序||
|onPullDownRefresh|监听用户下拉动作，一般用于下拉刷新，参考[示例](api/ui/pulldown)|||
|onReachBottom|页面滚动到底部的事件（不是scroll-view滚到底），常用于上拉加载下一页数据。如使用scroll-view导致页面级没有滚动，则触底事件不会被触发|||
|onTabItemTap|点击 tab 时触发，参数为Object，具体见下方注意事项|微信小程序、百度小程序、H5、App（自定义组件模式）||
|onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序||
|onPageScroll|监听页面滚动，参数为Object|||
|onNavigationBarButtonTap|监听原生标题栏按钮点击事件，参数为Object|App、H5||
|onBackPress|监听页面返回，返回 event = {from:backbutton、 navigateBack} ，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack ；详细说明及使用：[onBackPress 详解](https://ask.dcloud.net.cn/article/35120)|App、H5||
|onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|App、H5|1.6.0|
|onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。|App、H5|1.6.0|
|onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|App、H5|1.6.0|
``onPageScroll`` 参数说明：
|属性|类型|说明|
|---|---|---|
|scrollTop|Number|页面在垂直方向已滚动的距离（单位px）|
``onTabItemTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|String|被点击tabItem的序号，从0开始|
|pagePath|String|被点击tabItem的页面路径|
|text|String|被点击tabItem的按钮文字|
**注意**
- onTabItemTap常用于点击当前tabitem，滚动或刷新当前页面。如果是点击不同的tabitem，一定会触发页面切换。
- 如果想在App端实现点击某个tabitem不跳转页面，不能使用onTabItemTap，可以使用[plus.nativeObj.view](http://www.html5plus.org/doc/zh_cn/nativeobj.html)放一个区块盖住原先的tabitem，并拦截点击事件。
- onTabItemTap在App端，从HBuilderX 1.9 的自定义组件编译模式开始支持。
``onNavigationBarButtonTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|Number|原生标题栏按钮数组的下标|
`onBackPress` 回调参数对象说明：
|属性|类型|说明|
|---|---|---|
|from|String|触发返回行为的来源：'backbutton'——左上角导航栏按钮及安卓返回键；'navigateBack'——uni.navigateBack() 方法。|
```javascript
export default {
data() {
return {};
},
onBackPress(options) {
console.log('from:' + options.from)
}
}
```
**注意**
- nvue 页面的weex编译模式支持的生命周期，[参考](/use-weex?id=生命周期)。
docs/api/location/location.md
浏览文件 @ f51b016b
### uni.getLocation(OBJECT)
获取当前的地理位置、速度。
在微信小程序中，当用户离开应用后，此接口无法调用；当用户点击“显示在聊天顶部”时，此接口可继续调用。
在微信小程序中，当用户离开应用后，此接口无法调用，除非申请后台持续定位权限；当用户点击“显示在聊天顶部”时，此接口可继续调用。
**OBJECT 参数说明**
......@@ -61,6 +61,7 @@ uni.getLocation({
- App：``<map>`` 组件默认为国测局坐标gcj02，调用 ``uni.getLocation`` 返回结果传递给 ``<map>`` 组件时，需指定 type 为 gcj02。
- App：持续定位方案：iOS端可以申请持续定位权限，[参考](https://ask.dcloud.net.cn/article/12569)。Android如果进程被杀，代码无法执行。可以使用[unipush](https://ask.dcloud.net.cn/article/35622)，通过服务器激活App，执行透传消息，让App启动然后采集位置。Android上，即使自己写原生插件做后台进程，也很容易被杀，unipush是更合适的方案
- 小程序：api默认不返回详细地址中文描述。需要中文地址有2种方式：1、使用高德地图小程序sdk，在app和微信上都可以获得中文地址，[参考](http://ask.dcloud.net.cn/article/35070)。2、只考虑app，使用``plus.geolocation``也可以获取中文地址
- 可以通过用户授权API来判断用户是否给应用授予定位权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
### uni.chooseLocation(OBJECT)
打开地图选择位置。
......@@ -69,7 +70,7 @@ uni.getLocation({
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|x|
|√|√|√|√|√|√|x|
**OBJECT 参数说明**
......
docs/api/location/map.md
浏览文件 @ f51b016b
### uni.createMapContext(mapId,this)
创建并返回 map 上下文 ``mapContext`` 对象。在自定义组件下，第二个参数传入组件实例this，以操作组件内 ``<map>`` 组件。
**注意：uni.createMapContext(mapId, this)**
- app-nvue 平台 2.2.5+ 支持 uni.createMapContext(mapId, this)
- app-nvue 平台 2.2.5- 需要同时设置组件属性id和ref ``<map id="map1" ref="map1"></map>``，或者直接使用 ref，例如 ``this.$refs.map1``
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
......@@ -17,11 +22,11 @@ mapContext
|:-|:-|:-|:-|:-|
|getCenterLocation|OBJECT|获取当前地图中心的经纬度，返回的是 gcj02 坐标系，可以用于 [uni.openLocation](api/location/location?id=getlocation)|||
|moveToLocation||将地图中心移动到当前定位点，需要配合map组件的show-location使用|||
|translateMarker|OBJECT|平移marker，带动画|App-nvue 2.1.5+、微信小程序带动画||
|includePoints|OBJECT|缩放视野展示所有经纬度|App-nvue 2.1.5+||
|translateMarker|OBJECT|平移marker，带动画|app-nvue 2.1.5+、微信小程序带动画||
|includePoints|OBJECT|缩放视野展示所有经纬度|app-nvue 2.1.5+||
|getRegion|OBJECT|获取当前地图的视野范围|||
|getScale|OBJECT|获取当前地图的缩放级别|||
|$getAppMap||获取原生地图对象 [plus.maps.Map](https://www.html5plus.org/doc/zh_cn/maps.html#plus.maps.Map)|5+App自定义组件模式|1.9.3|
|$getAppMap||获取原生地图对象 [plus.maps.Map](https://www.html5plus.org/doc/zh_cn/maps.html#plus.maps.Map)|app-vue自定义组件模式|1.9.3|
`$getAppMap()` 注意事项：
......@@ -75,7 +80,7 @@ mapContext
**Tips**
- 如果想在App端实现更多地图功能，可通过`$getAppMap()`获取原生地图对象`plus.maps.Map`，然后参考[文档](https://www.html5plus.org/doc/zh_cn/maps.html#plus.maps.Map)实现更多功能。
- App端使用map，nvue比vue更强大。
- H5 端获取定位信息，需要部署在 **https** 服务上，本地预览（localhost）仍然可以使用 http 协议。
- 无 GPS 模块的 PC 设备使用 Chrome 浏览器的时候，位置信息是连接谷歌服务器获取的，国内用户可能获取位置信息失败。
- App 端使用地图组件需要向高德或百度等三方服务商申请SDK资质，获取AppKey，打包时需要在manifest的SDK配置中填写Appkey。在manifest可视化界面有详细申请指南。
......
docs/api/log.md
浏览文件 @ f51b016b
......@@ -17,4 +17,4 @@
- 不同平台对于 console 方法的支持存在差异，建议在开发过程中只使用文档中提到的方法。
- HBuilderX中有2个重要的代码块，敲`clog`：可直接输出`console.log()`；敲`clogv`：可输出`console.log(": " + );`，并且出现双光标，方便把变量名称和值同时打印出来。
- HBuilderX 1.9.7 以上的自定义组件模式，支持打印对象信息到控制台。老版本可使用`clogj`代码块将json对象转为字符串打印出来。
\ No newline at end of file
- HBuilderX 1.9.7 以上的自定义组件模式，在App端支持打印对象信息到控制台。老版本可使用`clogj`代码块将json对象转为字符串打印出来。
docs/api/media/audio-context.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|√|
**innerAudioContext 对象的属性列表**
......
docs/api/media/background-audio-manager.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|√|
**backgroundAudioManager 对象的属性列表**
......@@ -64,6 +64,7 @@ bgAudioMannager.src = 'https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp
```
Tips:
* ios应用背景播放需在manifest.json -> app-plus -> distribute -> ios 节点添加 ``"UIBackgroundModes":["audio"]`` 才能保证音乐可以后台播放（打包成ipa生效）。
\ No newline at end of file
**注意**
因为背景音频播放耗费手机电量，所以平台都有管控，需在manifest中填写申请。
- ios App平台，背景播放需在manifest.json -> app-plus -> distribute -> ios 节点添加 ``"UIBackgroundModes":["audio"]`` 才能保证音乐可以后台播放（打包成ipa生效）
- 小程序平台，需在manifest.json 对应的小程序节点下，填写"requiredBackgroundModes": ["audio"]。发布小程序时平台会审核
\ No newline at end of file
docs/api/media/camera-context.md
浏览文件 @ f51b016b
### uni.createCameraContext()
创建并返回 camera 上下文 cameraContext 对象。
创建并返回 camera 组件的上下文 cameraContext 对象。
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√|
本API为 camera 组件配套的js API，与 camera 组件的平台兼容性相同，可实现非全屏摄像头。App端可通过[plus.camera](https://www.html5plus.org/doc/zh_cn/camera.html)实现全屏摄像头。
**cameraContext 对象的方法列表**
......@@ -44,4 +46,5 @@
**注意**
- App下实现OCR等证件识别等需求，可在插件市场获取原生插件，[https://ext.dcloud.net.cn/plugin?id=135](https://ext.dcloud.net.cn/plugin?id=135)
- 微信小程序下实现OCR等证件识别等需求，插件市场也有封装，搜索 [ocr](https://ext.dcloud.net.cn/search?q=ocr) 可见。
\ No newline at end of file
- 微信小程序下实现OCR等证件识别等需求，插件市场也有封装，搜索 [ocr](https://ext.dcloud.net.cn/search?q=ocr) 可见。
- 可以通过用户授权API来判断用户是否给应用授予摄像头的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
docs/api/media/editor-context.md
浏览文件 @ f51b016b
## editorContext
editorContext 实例，可通过 [uni.createSelectorQuery](/api/ui/nodes-info?id=createselectorquery) 获取。
editor 组件对应的 editorContext 实例，可通过 [uni.createSelectorQuery](/api/ui/nodes-info?id=createselectorquery) 获取。
`editorContext` 通过 `id` 跟一个 [`<editor>`](/component/editor) 组件绑定，操作对应的 [`<editor>`](/component/editor) 组件。
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|x|
## editorContext.format(name, value)
......@@ -86,7 +86,7 @@ editorContext 实例，可通过 [uni.createSelectorQuery](/api/ui/nodes-info?id
| fail | Function | | 否 | 接口调用失败的回调函数 |
| complete | Function | | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
# editorContext.setContents(OBJECT)
## editorContext.setContents(OBJECT)
初始化编辑器内容，hmlt和delta同时存在时仅delta生效
......@@ -158,4 +158,4 @@ editorContext 实例，可通过 [uni.createSelectorQuery](/api/ui/nodes-info?id
| --- | --- | --- | --- | --- |
| success | Function | | 否 | 接口调用成功的回调函数 |
| fail | Function | | 否 | 接口调用失败的回调函数 |
| complete | Function | | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
\ No newline at end of file
| complete | Function | | 否 | 接口调用结束的回调函数（调用成功、失败都会执行） |
docs/api/media/image.md
浏览文件 @ f51b016b
......@@ -19,6 +19,7 @@ App端如需要更丰富的相机拍照API（如直接调用前置摄像头）
**Tips**
- count 值在 H5 平台的表现，基于浏览器本身的规范。目前测试的结果来看，只能限制单选/多选，并不能限制数量。并且，在实际的手机浏览器很少有能够支持多选的。
- 可以通过用户授权API来判断用户是否给应用授予相册或摄像头的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
**注：文件的临时路径，在应用本次启动期间可以正常使用，如需持久保存，需在主动调用 [uni.saveFile](api/file/file?id=savefile)，在应用下次启动时才能访问得到。**
......@@ -210,6 +211,10 @@ uni.chooseImage({
|:-|:-|:-|
|errMsg|String|调用结果|
**注意**
- 可以通过用户授权API来判断用户是否给应用授予相册的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
**示例代码：**
```javascript
......@@ -235,7 +240,7 @@ uni.chooseImage({
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序
|:-:|:-:|:-:|:-:|:-:|:-:|
|1.9.7+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|√|√|x|x|
|1.9.7+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|√|√|x|√|
**OBJECT 参数说明**
......@@ -268,11 +273,11 @@ uni.compressImage({
# wx.chooseMessageFile(OBJECT)
从客户端会话选择文件。
从微信聊天会话中选择文件。
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|x|x|
docs/api/media/live-player-context.md
浏览文件 @ f51b016b
### uni.createLivePlayerContext(livePlayerId, this)
创建 live-player 上下文 livePlayerContext 对象。
创建 live-player 上下文 livePlayerContext 对象。注意是直播的播放而不是推流。
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|见下|x|√|x|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|见下|x|√|x|√|x|√|
App平台的直播，不使用此API，而使用`plus.video.createLivePusher`，[详见](https://ask.dcloud.net.cn/article/13416)
App平台的直播播放，不使用此API，而直接使用video的API。
**参数说明**
......@@ -44,3 +44,99 @@ App平台的直播，不使用此API，而使用`plus.video.createLivePusher`，
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数（调用成功、失败都会执行）|
### uni.createLivePusherContext(livePusherId, this)
创建 live-pusher 上下文 livePusherContext 对象。
**平台差异说明**
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|见下|x|√|x|x|x|x|
- app-nvue 平台 2.2.5(alpha)+ 支持 uni.createLivePusherContext(livePusherId, this)
- app-nvue 平台 2.2.5(alpha)- 需要同时设置组件属性id和ref ``<live-pusher id="livepusher1" ref="livepusher1"></live-pusher>``，或者直接使用 ref，例如 ``this.$refs.livepusher1``
- app-vue 平台，需要编写条件编译代码，使用 `plus.video.LivePusher`，[业务指南](https://ask.dcloud.net.cn/article/13416)、[规范文档](http://www.html5plus.org/doc/zh_cn/video.html#plus.video.LivePusher)
使用nvue做直播，比使用vue的优势有：
1. nvue可一套代码直接编译到App和微信
2. nvue的cover-view比vue的cover-view更强大，在视频上绘制元素更容易。如果只考虑App端的话，不用cover-view，任意组件都可以覆盖live-pusher组件
3. 若需要视频内嵌在swiper里上下滑动（类抖音、映客首页模式），App端只有nvue才能实现
当然nvue相比vue的坏处是css写法受限，如果只开发微信小程序，不考虑App，那么使用vue页面也是一样的。
**参数说明**
设置live-pusher组件的推流地址，推流视频模式等。
属性|类型 |默认值|必填|说明 :--|:--|:--|:--|:--|
url|string| |是|推流地址，支持RTMP协议。
mode |string| |否|推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。
muted|Boolean|false|否|是否静音。
enable-camera|Boolean|true|否|开启摄像头。
auto-focus|Boolean|true|否|自动聚集。
beauty|Number|0|否|美颜，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
whiteness|Number|0|否|美白，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
#### API #### start(callback)
> 开始推流
##### callback 返回 Object 参数说明
属性|类型 |说明 :--|:--|:--|
type | String | "success" 表示成功， "fail" 表示失败 #### pause(callback) > 暂停推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### resume(callback) > 恢复推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### stop(callback) > 停止推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### switchCamera(callback) > 切换前后摄像头
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### snapshot(callback) > 快照
##### callback 返回 Object 参数说明
##### 成功时的回调 参数|类型 |说明 :--|:--|:--| type|string|"success" 表示成功, "fail" 表示失败
code|Number| 对应code码
message|object|{width:"快照图片宽度",height:"快照图片高度",tempImagePath:"快照图片路径"}。
##### 失败的回调 参数|类型 |说明 :--|:--|:--| type|string|"fail" 表示失败
code|Number|
message|object|
#### startPreview(callback) > 开启摄像头预览
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### stopPreview(callback) > 关闭摄像头预览
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### 事件
#### statechange
> 状态变化事件 ##### 返回参数（detail）的详细说明 参数|类型|说明 :--|:--|:--|
code|Number|
message|string|
#### netstatus
> 网络状态通知事件 ##### 安卓 返回参数（detail）的详细说明 键名|说明 :--|:--|
videoBitrate | 当前视频编/码器输出的比特率，单位 kbps
audioBitrate | 当前音频编/码器输出的比特率，单位 kbps
videoFPS | 当前视频帧率
videoGOP | 当前视频 GOP,也就是每两个关键帧(I帧)间隔时长，单位 s
netSpeed | 当前的发送/接收速度
netJitter | 网络抖动情况，抖动越大，网络越不稳定
videoWidth | 视频画面的宽度
videoHeight | 视频画面的高度
##### iOS 返回参数（detail）的详细说明 参数|类型 |说明 :--|:--|:--|
code|Number| code码
message|string| 具体的网络状态信息
#### error > 渲染错误事件 ##### 返回参数（detail）的详细说明 参数|类型 |说明 :--|:--|:--|
errCode|Number|
errMsg|string|
......
docs/api/media/live-pusher-context.md 0 → 100644
浏览文件 @ f51b016b
### uni.createLivePusherContext(livePusherId, this)
创建 live-pusher 上下文 livePusherContext 对象。
**平台差异说明**
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|见下|x|√|x|x|x|
**参数说明**
设置live-pusher组件的推流地址，推流视频模式等。
属性|类型 |默认值|必填|说明 :--|:--|:--|:--|:--|
url|string| |是|推流地址，支持RTMP协议。
mode |string| |否|推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。
muted|Boolean|false|否|是否静音。
enable-camera|Boolean|true|否|开启摄像头。
auto-focus|Boolean|true|否|自动聚集。
beauty|Number|0|否|美颜，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
whiteness|Number|0|否|美白，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
**注意：**
- app-nvue 平台 2.2.5(alpha)+ 支持 uni.createLivePusherContext(livePusherId, this)
- app-nvue 平台 2.2.5(alpha)- 需要同时设置组件属性id和ref ``<live-pusher id="livepusher1" ref="livepusher1"></live-pusher>``，或者直接使用 ref，例如 ``this.$refs.livepusher1``
### API #### start(callback)
> 开始推流
##### callback 返回 Object 参数说明
属性|类型 |说明 :--|:--|:--|
type | String | "success" 表示成功， "fail" 表示失败 #### pause(callback) > 暂停推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### resume(callback) > 恢复推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### stop(callback) > 停止推流
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### switchCamera(callback) > 切换前后摄像头
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### snapshot(callback) > 快照
##### callback 返回 Object 参数说明
##### 成功时的回调 参数|类型 |说明 :--|:--|:--| type|string|"success" 表示成功, "fail" 表示失败
code|Number| 对应code码
message|object|{width:"快照图片宽度",height:"快照图片高度",tempImagePath:"快照图片路径"}。
##### 失败的回调 参数|类型 |说明 :--|:--|:--| type|string|"fail" 表示失败
code|Number|
message|object|
#### startPreview(callback) > 开启摄像头预览
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
#### stopPreview(callback) > 关闭摄像头预览
##### callback 返回 Object 参数说明 参数|类型 |说明 :--|:--|:--| type | String | "success" 表示成功， "fail" 表示失败
### 事件
#### statechange
> 状态变化事件 ##### 返回参数（detail）的详细说明 参数|类型|说明 :--|:--|:--|
code|Number|
message|string|
#### netstatus
> 网络状态通知事件 ##### 安卓 返回参数（detail）的详细说明 键名|说明 :--|:--|
videoBitrate | 当前视频编/码器输出的比特率，单位 kbps
audioBitrate | 当前音频编/码器输出的比特率，单位 kbps
videoFPS | 当前视频帧率
videoGOP | 当前视频 GOP,也就是每两个关键帧(I帧)间隔时长，单位 s
netSpeed | 当前的发送/接收速度
netJitter | 网络抖动情况，抖动越大，网络越不稳定
videoWidth | 视频画面的宽度
videoHeight | 视频画面的高度
##### iOS 返回参数（detail）的详细说明 参数|类型 |说明 :--|:--|:--|
code|Number| code码
message|string| 具体的网络状态信息
#### error > 渲染错误事件 ##### 返回参数（detail）的详细说明 参数|类型 |说明 :--|:--|:--|
errCode|Number|
errMsg|string|
docs/api/media/record-manager.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|√|
**recorderManager 对象的方法列表**
......@@ -66,6 +66,10 @@
|:-|:-|:-|
|errMsg|String|错误信息|
**注意**
- 可以通过用户授权API来判断用户是否给应用授予麦克风的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
**示例**
```html
......@@ -116,4 +120,4 @@ export default {
}
}
}
```
\ No newline at end of file
```
docs/api/media/video-context.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|x|√|√|√|
**videoContext 对象的方法列表**
......@@ -13,7 +13,7 @@
|:-|:-|:-|
|play|无|播放|
|pause|无|暂停|
|seek|position|跳转到指定位置，单位 s|
|seek|position|跳转到指定位置，单位 s|
|stop||停止视频，仅`微信小程序平台`支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/VideoContext.stop.html)|
|sendDanmu|danmu|发送弹幕，danmu 包含两个属性 text, color|
|playbackRate|rate|设置倍速播放，支持的倍率有 0.5/0.8/1.0/1.25/1.5|
......@@ -22,6 +22,9 @@
|showStatusBar|无|显示状态栏，仅在iOS全屏下有效|
|hideStatusBar|无|隐藏状态栏，仅在iOS全屏下有效|
**注意：**
- app-nvue 平台 2.2.5(alpha)+ 支持 uni.createVideoContext(videoId, this)
- app-nvue 平台 2.2.5(alpha)- 需要同时设置组件属性id和ref ``<video id="video1" ref="video1"></video>``，或者直接使用 ref，例如 ``this.$refs.video1``
**示例**
......@@ -110,4 +113,4 @@ export default {
}
}
}
```
\ No newline at end of file
```
docs/api/media/video.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|√|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|√|√|
**OBJECT 参数说明**
......@@ -32,6 +32,7 @@
**注意：**
* 文件的临时路径，在应用本次启动期间可以正常使用，如需持久保存，需在主动调用 [uni.saveFile](api/file/file?id=savefile)，在应用下次启动时才能访问得到。
* camera 部分 Android 手机下由于系统 ROM 不支持无法生效，打开拍摄界面后可操作切换
* 可以通过用户授权API来判断用户是否给应用授予相册或摄像头的访问权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
* App下如需进一步压缩视频大小，可以在插件市场搜索[视频压缩](http://ext.dcloud.net.cn/search?q=%E8%A7%86%E9%A2%91%E5%8E%8B%E7%BC%A9)插件
**示例**
......@@ -70,9 +71,9 @@ export default {
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|√|√|√|
**OBJECT 参数说明**
......@@ -89,6 +90,10 @@ export default {
|:-|:-|:-|
|errMsg|String|调用结果|
**注意**
- 可以通过用户授权API来判断用户是否给应用授予相册写入权限[https://uniapp.dcloud.io/api/other/authorize](https://uniapp.dcloud.io/api/other/authorize)
**示例**
```html
......@@ -125,4 +130,4 @@ export default {
}
}
}
```
\ No newline at end of file
```
docs/api/other/advertisement.md
浏览文件 @ f51b016b
#### 广告
仅微信小程序平台、App平台支持
广告API
微信小程序平台实现参考：[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.createRewardedVideoAd.html)
广告能力在不同小程序端实现不同，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
App平台实现参考：[DCloud广告联盟](http://ask.dcloud.net.cn/article/13084)
\ No newline at end of file
- App平台：无需编码，在打包App时可直接勾选广告位，[详见](https://dcloud.io/dad.html)
- 微信小程序：[规范文档](https://developers.weixin.qq.com/miniprogram/dev/api/wx.createRewardedVideoAd.html)
- 百度小程序：有组件但无API
- 支付宝小程序：不支持此能力
- 头条小程序：仅小游戏可用，小程序不可用，不适用于uni-app
- QQ小程序：[规范文档](https://q.qq.com/wiki/develop/miniprogram/API/ad/qq.createRewardedVideoAd.html)
\ No newline at end of file
docs/api/other/authentication.md
浏览文件 @ f51b016b
#### 生物认证
#### 生物认证
生物认证，又称活体检测。它包含指纹识别、人脸识别这两部分。即通过人体身体特征来进行身份认证识别。
各平台开发方式暂未统一，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
各平台开发方式暂未统一，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
##### 微信小程序
支持指纹和人脸识别两部分，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.startSoterAuthentication.html)
支持指纹和人脸识别两部分，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.startSoterAuthentication.html)
如果使用腾讯云的SDK，可参考[网友分享](https://segmentfault.com/a/1190000020102601)
##### App平台
- 指纹：html5plus已经内置指纹API，[规范详情](http://www.html5plus.org/doc/zh_cn/fingerprint.html)。在插件市场有一个封装好的微信和App的指纹识别插件：[https://ext.dcloud.net.cn/plugin?id=358](https://ext.dcloud.net.cn/plugin?id=358)
- 人脸识别：app引擎未内置，需要安装原生插件，详见[插件市场人脸识别插件](https://ext.dcloud.net.cn/search?q=%E4%BA%BA%E8%84%B8%E8%AF%86%E5%88%AB)
......@@ -16,4 +18,4 @@
只支持人脸识别，[规范详情](https://docs.alipay.com/mini/api/alipay-face-verify)
##### 百度小程序
只支持人脸识别，[规范详情](https://smartprogram.baidu.com/docs/develop/api/ai_face/#swan-ai-faceDetect/)
\ No newline at end of file
只支持人脸识别，[规范详情](https://smartprogram.baidu.com/docs/develop/api/ai_face/#swan-ai-faceDetect/)
docs/api/other/authorize.md
浏览文件 @ f51b016b
......@@ -4,10 +4,12 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|√|
注意：App平台的授权判断方式，另见：[https://ext.dcloud.net.cn/plugin?id=594](https://ext.dcloud.net.cn/plugin?id=594)
**OBJECT 参数说明**
|参数|类型|必填|说明|
......
docs/api/other/choose-address.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|x|
**OBJECT参数说明**
......
docs/api/other/get-extconfig.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|x|
**OBJECT参数说明**
......@@ -45,9 +45,9 @@ if (uni.getExtConfig) {
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|x|
**返回值(Object)**
......
docs/api/other/getAccountInfoSync.md
浏览文件 @ f51b016b
......@@ -5,9 +5,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√|
**返回值**
......
docs/api/other/invoice-title.md
浏览文件 @ f51b016b
......@@ -6,9 +6,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**OBJECT参数说明**
......
docs/api/other/open-miniprogram.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@
**平台差异说明**
|App|H5|[微信小程序](https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html)|[支付宝小程序](https://docs.alipay.com/mini/api/zwi8gx)|[百度小程序](https://smartprogram.baidu.com/docs/develop/api/open_smartprogram/#swan-navigateToSmartProgram/)|[头条小程序](https://developer.toutiao.com/docs/open/navigateToMiniProgram.html)|[QQ小程序](https://q.qq.com/wiki/develop/miniprogram/API/open_port/port_change.html#qq-navigatetominiprogram)|
|App|H5|[微信小程序](https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html)|[支付宝小程序](https://docs.alipay.com/mini/api/open-miniprogram)|[百度小程序](https://smartprogram.baidu.com/docs/develop/api/open_smartprogram/#swan-navigateToSmartProgram/)|[头条小程序](https://developer.toutiao.com/docs/open/navigateToMiniProgram.html)|[QQ小程序](https://q.qq.com/wiki/develop/miniprogram/API/open_port/port_change.html#qq-navigatetominiprogram)|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x(见下)|x|√|√|√|√(1.15.0+)|√|
......
docs/api/other/set-enable-debug.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√|
**OBJECT说明**
......
docs/api/other/template.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
......@@ -66,9 +66,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templateadd?access_tok
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
```
......@@ -120,9 +120,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
......@@ -229,9 +229,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/libraryget?access_toke
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
......@@ -318,9 +318,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/librarylist?access_tok
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
......@@ -416,9 +416,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatelist?access_to
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|x|
**请求地址**
......@@ -549,9 +549,9 @@ POST https://openapi.baidu.com/rest/2.0/smartapp/template/templatedel?access_tok
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|x|√|x|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|x|√|x|x|x|
**请求地址**
......
docs/api/other/update.md
浏览文件 @ f51b016b
......@@ -8,9 +8,9 @@ App的更新不使用本API，另见文档：
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|√|√|
**updateManager 对象的方法列表：**
......
docs/api/plugins/login.md
浏览文件 @ f51b016b
......@@ -3,9 +3,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
H5平台登陆注意事项：
- 微信内嵌浏览器运行H5版时，可通过js sdk实现微信登陆，需要引入一个单独的js，[详见](https://ask.dcloud.net.cn/article/35380)
......@@ -56,9 +56,9 @@ uni.login({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|√|
|属性|类型|必填|说明|
|:-|:-|:-|:-|
......@@ -73,9 +73,9 @@ uni.login({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|√|√|
**注意：** 微信小程序端，在用户未授权过的情况下调用此接口，不会出现授权弹窗，会直接进入 fail 回调（详见[《微信小程序公告》](https://developers.weixin.qq.com/community/develop/doc/0000a26e1aca6012e896a517556c01)）。在用户已授权的情况下调用此接口，可成功获取用户信息。
......
docs/api/plugins/payment.md
浏览文件 @ f51b016b
......@@ -11,9 +11,9 @@ uni.requestPayment是一个统一各平台的客户端支付API，不管是在
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|[说明](/api/plugins/payment?id=h5-payment)|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|[说明](/api/plugins/payment?id=h5-payment)|√|√|√|√|√|
**OBJECT 参数说明**
......@@ -113,6 +113,9 @@ uni.requestPayment是一个统一各平台的客户端支付API，不管是在
- Q：App端如何集成其他支付SDK
- A：使用原生插件方式，可以集成如paypal或三方聚合支付sdk，原生插件开发文档见[https://ask.dcloud.net.cn/article/35428](https://ask.dcloud.net.cn/article/35428)。开发之前可以先去[插件市场](https://ext.dcloud.net.cn/)看下有没有做好的。
- Q：Appstore审核报PGPay SDK不允许上架的问题
- A：数字类产品（比如购买会员等不需要配送实物的商品），Apple规定必须使用苹果IAP应用内支付，给Apple分成30%。打包的时候不要勾选微信或支付宝等其他支付方式。如果你提交的包里包含了微信支付宝等支付的sdk，即使没使用，Appstore也会认为你有隐藏方式，以后会绕过iap，不给Apple分成，因此拒绝你的App上线。云打包时，manifest里选上支付模块，但sdk配置里去掉微信支付和支付宝支付。很多开发者的Android版是包含微信和支付宝支付的，此时注意分开判断。
**示例**
App 支付
......@@ -262,4 +265,4 @@ uni.requestPayment({
}
}
</script>
```
\ No newline at end of file
```
docs/api/plugins/provider.md
浏览文件 @ f51b016b
### uni.getProvider(OBJECT)
获取服务供应商。
获取服务供应商。仅App平台支持。
在App平台，可用的服务商，是打包环境中配置的服务商，与手机端安装了什么app没有关系。
......
docs/api/plugins/push.md
浏览文件 @ f51b016b
......@@ -7,6 +7,10 @@
uni push 推送的开发API文档：[https://www.html5plus.org/doc/zh_cn/push.html](https://www.html5plus.org/doc/zh_cn/push.html)
插件市场有很多推送相关的插件，包括检查应用是否被授予推送权限（[参考](https://ext.dcloud.net.cn/plugin?id=594)）、开启关闭推送服务（[参考](https://ext.dcloud.net.cn/plugin?id=727)）、自定义iOS推送铃声（[参考](https://ext.dcloud.net.cn/plugin?id=690)）
插件市场也提供了其他三方推送方案，但注意unipush是推送成功率更高的解决方案，并且免费使用，更推荐使用。
- 小程序平台
小程序平台的类似概念叫做`模板消息`。
......
docs/api/plugins/voice.md
浏览文件 @ f51b016b
#### voice
video包括语言识别和语音朗读两部分。
仅百度小程序平台、App平台支持，各平台开发方式暂未统一，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
百度小程序平台支持语音识别，参考：[规范详情](https://smartprogram.baidu.com/docs/develop/api/ai_voice/)
App 平台实现参考：
#### voice
voice 包括语言识别和语音朗读两部分。
仅百度小程序平台、App平台支持，各平台开发方式暂未统一，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
百度小程序平台支持语音识别，参考：[规范详情](https://smartprogram.baidu.com/docs/develop/api/ai_voice/)
App 平台实现参考：
- 语音识别：支持科大讯飞语音识别和百度语音识别，云打包的话需要在manifest中勾选模块和App SDK配置，开发规范见：[https://www.html5plus.org/doc/zh_cn/speech.html](https://www.html5plus.org/doc/zh_cn/speech.html)，配置文档及讯飞百度的差别见：[https://ask.dcloud.net.cn/article/35059](https://ask.dcloud.net.cn/article/35059)
- 语音朗读：调用科大讯飞进行语音合成、tts朗读，参考[https://ask.dcloud.net.cn/article/1081](https://ask.dcloud.net.cn/article/1081)
\ No newline at end of file
- 语音朗读：调用科大讯飞进行语音合成、tts朗读，参考[https://ask.dcloud.net.cn/article/1081](https://ask.dcloud.net.cn/article/1081)
docs/api/request/mDNS.md
浏览文件 @ f51b016b
#### mDNS 服务
仅微信小程序平台支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.stopLocalServiceDiscovery.html)
- 微信小程序平台支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.stopLocalServiceDiscovery.html)
- App端可在插件市场搜索相关插件[mDNS](https://ext.dcloud.net.cn/search?q=mdns)
docs/api/request/request.md
浏览文件 @ f51b016b
......@@ -13,6 +13,7 @@
|method|String|否|GET|有效值详见下方说明||
|dataType|String|否|json |如果设为 json，会尝试对返回的数据做一次 JSON.parse||
|responseType|String|否|text |设置响应的数据类型。合法值：text、arraybuffer|5+App和支付宝小程序不支持|
|sslVerify|Boolean|否|true|验证 ssl 证书|仅5+App安卓端支持（HBuilderX 2.3.4+）|
|success|Function|否||收到开发者服务成功返回的回调函数||
|fail|Function|否||接口调用失败的回调函数||
|complete|Function|否||接口调用结束的回调函数（调用成功、失败都会执行）|&nbsp;|
......@@ -87,8 +88,8 @@ requestTask.abort();
|方法|参数|说明|
|:-|:-|:-|
|abort||中断请求任务|
|offHeadersReceived||取消监听 HTTP Response Header 事件，仅`微信小程序平台`支持，[文档详情](https://developers.weixin.qq.com/miniprogram/dev/api/RequestTask.offHeadersReceived.html)|
|onHeadersReceived||监听 HTTP Response Header 事件。会比请求完成事件更早，仅`微信小程序平台`支持，[文档详情](https://developers.weixin.qq.com/miniprogram/dev/api/RequestTask.onHeadersReceived.html)|
|offHeadersReceived||取消监听 HTTP Response Header 事件，仅`微信小程序平台`支持，[文档详情](https://developers.weixin.qq.com/miniprogram/dev/api/RequestTask.offHeadersReceived.html)|
|onHeadersReceived||监听 HTTP Response Header 事件。会比请求完成事件更早，仅`微信小程序平台`支持，[文档详情](https://developers.weixin.qq.com/miniprogram/dev/api/RequestTask.onHeadersReceived.html)|
**示例**
......@@ -114,9 +115,14 @@ requestTask.abort();
- 网络请求的 ``超时时间`` 可以统一在 ``manifest.json`` 中配置 [networkTimeout](/collocation/manifest?id=networktimeout)。
- H5 端本地调试需注意跨域问题，参考：[调试跨域问题解决方案](https://ask.dcloud.net.cn/article/35267)
- 注意由于百度小程序iOS客户端，请求失败时会进入fail回调，需要针对百度增加相应的处理以解决该问题。
- 注意非 H5 端不支持 cookie，服务器应避免验证 cookie。如果服务器无法修改，也可以使用一些模拟手段，比如这样的工具[https://github.com/charleslo1/weapp-cookie](https://github.com/charleslo1/weapp-cookie)
- 注意非 H5 端不支持 cookie，服务器应避免验证 cookie。如果服务器无法修改，也可以使用一些模拟手段，比如这样的工具[https://github.com/charleslo1/weapp-cookie](https://github.com/charleslo1/weapp-cookie)
- 按照 W3C 规范，H5 端无法获取 response header 中 Set-Cookie、Set-Cookie2 这2个字段，对于跨域请求，允许获取的 response header 字段只限于“simple response header”和“Access-Control-Expose-Headers”（[详情](https://www.w3.org/TR/cors/#access-control-allow-credentials-response-header)）
- [uni-app 插件市场](https://ext.dcloud.net.cn/search?q=%E6%8B%A6%E6%88%AA%E5%99%A8)有flyio、axios等三方封装的拦截器可用
- 低版本手机自身不支持 ipv6，如果服务器仅允许 ipv6，会导致老手机无法正常运行或访问速度非常慢
- localhost、127.0.0.1等服务器地址，只能在电脑端运行，手机端连接时不能访问。请使用标准IP并保证手机能连接电脑网络
- debug 模式，安卓端暂时无法获取响应头，url中含有非法字符（如未编码为%20的空格）时会请求失败
\ No newline at end of file
- localhost、127.0.0.1等服务器地址，只能在电脑端运行，手机端连接时不能访问。请使用标准IP并保证手机能连接电脑网络
- debug 模式，安卓端暂时无法获取响应头，url中含有非法字符（如未编码为%20的空格）时会请求失败
- iOS App第一次安装启动后，会弹出是否允许联网的询问框，在用户点击同意前，调用联网API会失败。请注意判断这种情况。比如官方提供的新闻模板示例（HBuilderX新建项目可选择），会判断如果无法联网，则提供一个错误页，提示用户设置网络及下拉刷新重试。
- 良好体验的App，还会判断当前是否处于飞行模式（[参考](https://ext.dcloud.net.cn/plugin?id=594)）、是wifi还是3G（[参考](https://uniapp.dcloud.io/api/system/network)）
- 部分安卓设备，真机运行或debug模式下的网络，低于release模式很多。
- 安卓端请求某些 https 服务会失败，可以尝试配置 sslVerify 为 false 关闭 ssl 证书验证
- 单次网络请求数据量建议控制在50K以下（仅指json数据，不含图片），过多数据应分页获取，以提升应用体验。
docs/api/request/websocket.md
浏览文件 @ f51b016b
......@@ -50,8 +50,12 @@ var socketTask = uni.connectSocket({
**注意事项**
- 网络请求的 ``超时时间`` 可以统一在 ``manifest.json`` 中配置 [networkTimeout](/collocation/manifest?id=networktimeout)。
- App目前不支持 ``ArrayBuffer`` 类型的数据收发。可以使用 [plus-websocket](https://ext.dcloud.net.cn/plugin?id=647) 插件替代。
- 自定义组件模式下所有 `vue` 页面只能使用一个 `websocket` 连接。可以使用 [plus-websocket](https://ext.dcloud.net.cn/plugin?id=647) 插件替代。
- App平台，2.2.6以下的版本，不支持 ``ArrayBuffer`` 类型的数据收发。老版本不愿升级也可以使用 [plus-websocket插件](https://ext.dcloud.net.cn/plugin?id=647) 插件替代。
- App平台自定义组件模式下，以及支付宝小程序下，所有 `vue` 页面只能使用一个 `websocket` 连接。App下可以使用 [plus-websocket](https://ext.dcloud.net.cn/plugin?id=647) 插件替代实现多链接。App平台，2.2.6+起支持多个socket链接，数量没有限制。
- 微信小程序平台1.7.0 及以上版本，最多可以同时存在5个WebSocket 连接。老版本只支持一个socket连接
- 百度小程序平台自基础库版本 1.9.4 及以后支持多个socket连接。老版本只支持一个socket连接
- QQ小程序平台最多支持同时存在5个socket链接
### uni.onSocketOpen(CALLBACK)
监听WebSocket连接打开事件。
......
docs/api/router.md
浏览文件 @ f51b016b
......@@ -176,8 +176,13 @@ Tips：
* 页面底部的 ``tabBar`` 由页面决定，即只要是定义为 ``tabBar`` 的页面，底部都有 ``tabBar``。
* 不能在 ```App.vue``` 里面进行页面跳转。
**参考事项**
- 页面路由拦截和管理，插件市场有很多封装好的工具类，搜索[路由](https://ext.dcloud.net.cn/search?q=%E8%B7%AF%E7%94%B1)
#### 窗口动画@animation
> 本API仅App端支持。小程序自身不支持自定义动画。H5的窗体动画可使用常规单页动画处理方案，见[H5下单页动画示例](https://ext.dcloud.net.cn/plugin?id=659&tdsourcetag=s_pctim_aiomsg)
> 本API仅App支持。小程序自身不支持自定义动画。H5的窗体动画可使用常规单页动画处理方案，见[H5下单页动画示例](https://ext.dcloud.net.cn/plugin?id=659&tdsourcetag=s_pctim_aiomsg)
窗口的显示/关闭动画效果，支持在 API、组件、pages.json 中配置，优先级为：`API = 组件 > pages.json`。
......@@ -228,10 +233,10 @@ pages.json 中配置的是窗口显示的动画
|slide-in-left|slide-out-left|新窗体从左侧进入|
|slide-in-top|slide-out-top|新窗体从顶部进入|
|slide-in-bottom|slide-out-bottom|新窗体从底部进入|
|pop-in|pop-out|新窗体从左侧进入，且老窗体被挤压而出|
|fade-in|fade-out|新窗体从透明到不透明逐渐显示|
|zoom-out|zoom-in|新窗体从小到大缩放显示|
|zoom-fade-out|zoom-fade-in|新窗体从小到大逐渐放大并且从透明到不透明逐渐显示|
|pop-in|pop-out|新窗体从左侧进入，且老窗体被挤压而出|
|none|none|无动画|
详细的窗口动画说明，请参考：
......@@ -239,5 +244,7 @@ pages.json 中配置的是窗口显示的动画
- 窗口显示的动画：[AnimationTypeShow](http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.AnimationTypeShow)
- 窗口关闭的动画：[AnimationTypeClose](http://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.AnimationTypeClose)
**参考事项**
- 页面路由拦截和管理，插件市场有很多封装好的工具类，搜索[路由](https://ext.dcloud.net.cn/search?q=%E8%B7%AF%E7%94%B1)
**注意**
- 纯nvue项目（render为native），窗体动画默认进入动画为popin，返回为pop-out。如果想修改动画类型，只能通过uni.navigateTo API修改，在组件或pages.json里配置动画类型无效
- 非纯nvue项目，App端窗体动画，默认进入动画为slider-in-right，默认返回动画为pop-out
docs/api/system/batteryInfo.md
浏览文件 @ f51b016b
......@@ -6,3 +6,5 @@
- 百度小程序平台：[规范详情](https://smartprogram.baidu.com/docs/develop/api/device_battery/#swan-getBatteryInfo/)
- 支付宝小程序平台：[规范详情](https://docs.alipay.com/mini/api/nrnziy)
- QQ小程序平台：[规范详情](https://q.qq.com/wiki/develop/miniprogram/API/equipment/ibeacon_battery.html)
- App平台：使用 Native.js，[参考](https://ask.dcloud.net.cn/article/992)
- H5平台：使用 navigator.battery API
docs/api/system/capture-screen.md
浏览文件 @ f51b016b
......@@ -6,7 +6,7 @@
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|√|√|x|√|
|x|x|√|√|√|√|√|
**CALLBACK返回参数：**
......
docs/api/system/contact.md
浏览文件 @ f51b016b
......@@ -5,7 +5,7 @@ App平台提供了更多通讯录相关API，包括读取联系人，详见：[h
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|√|√|x|x|
......@@ -78,5 +78,5 @@ uni.addPhoneContact({
**注意**
- 手机OS对通讯录访问有严格的权限限制和要求。在小程序中使用时，需注意微信等小程序载体本身已经获得了手机端的授权许可。
- 手机OS对通讯录访问有严格的权限限制和要求。在小程序中使用时，需注意微信等小程序载体本身已经获得了手机端的授权许可。App端获取通讯录相关权限，参考[https://ext.dcloud.net.cn/plugin?id=594](https://ext.dcloud.net.cn/plugin?id=594)
- 打包App时，云打包则需要在manifest中配置权限和模块，离线打包需自行在原生工程中配置。
docs/api/system/deviceMotion.md
浏览文件 @ f51b016b
......@@ -2,4 +2,4 @@
仅微信小程序平台支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/device/motion/wx.startDeviceMotionListening.html)
在App平台，也可以通过监听窗体大小变化onResize来实现此类需求。[详见](https://uniapp.dcloud.io/collocation/frame/lifetime?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f)
在App平台，也可以通过监听窗体大小变化onResize来实现此类需求。[详见](https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e9%a1%b5%e9%9d%a2%e7%94%9f%e5%91%bd%e5%91%a8%e6%9c%9f)
docs/api/ui/animation.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|HBuilderX 2.0.4+|√|√|√|√|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|HBuilderX 2.0.4+|√|√|√|√|√|
**注意:**
- export 方法每次调用后会清掉之前的动画操作
......
docs/api/ui/bgcolor.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√|
**参数说明**
......@@ -35,9 +35,9 @@ uni.setBackgroundColor({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|x|√|
**参数说明**
......
docs/api/ui/font.md
浏览文件 @ f51b016b
......@@ -12,9 +12,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|1.9.0+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|基础库 2.1.0+|x|x|x|
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|1.9.0+ [自定义组件编译模式](https://ask.dcloud.net.cn/article/35843)|x|基础库 2.1.0+|x|x|x|x|
**参数说明**
......
docs/api/ui/menuButton.md
浏览文件 @ f51b016b
......@@ -2,12 +2,30 @@
在小程序平台，如果原生导航栏被隐藏，仍然在右上角会有一个悬浮按钮，微信下也被称为胶囊按钮。本API用于获取小程序下该菜单按钮的布局位置信息，方便开发者布局顶部内容时避开该按钮。
坐标信息以屏幕左上角为原点。
坐标信息以屏幕左上角为原点。
**平台差异说明**
|5+App |H5 |微信小程序 |支付宝小程序 |百度小程序 |头条小程序 |QQ小程序 |
|:-: |:-:|:-: |:-: |:-: |:-: |:-: |
|x |x |√ |x |√ |√ |√ |
**返回值说明**
|属性 |类型 |说明 |
|width |number |宽度，单位：px |
|height |number |高度，单位：px |
|top |number |上边界坐标，单位：px |
|right |number |右边界坐标，单位：px |
|bottom |number |下边界坐标，单位：px |
|left |number |左边界坐标，单位：px |
**示例**
```javascript
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
```
各平台开发方式暂未统一，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
**注意**
- 微信小程序：[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/wx.getMenuButtonBoundingClientRect.html)
- 百度小程序：[规范详情](https://smartprogram.baidu.com/docs/develop/api/menu_info/)
- 支付宝小程序：其逻辑与微信小程序不同，它提供了菜单点击后按钮的自定义功能，可以选择显示那些系统按钮，[规范详情](https://docs.alipay.com/mini/api/optionmenuitem)
- 头条小程序：[规范详情](https://developer.toutiao.com/docs/game/ui/menu/tt.getMenuButtonBoundingClientRect.html)
- QQ小程序：[规范详情](https://q.qq.com/wiki/develop/game/API/interface/menu.html#qq-getmenubuttonboundingclientrect)
docs/api/ui/navigationbar.md
浏览文件 @ f51b016b
......@@ -26,9 +26,9 @@ uni.setNavigationBarTitle({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明**
......@@ -82,9 +82,11 @@ uni.setNavigationBarColor({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|√|
App平台调用此API时会在屏幕中间悬浮显示loading
**OBJECT参数说明**
......@@ -106,9 +108,11 @@ uni.showNavigationBarLoading()
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|√|√|√|√|x|√|
App平台调用此API时会关闭屏幕中间悬浮显示的loading
**OBJECT参数说明**
......
docs/api/ui/nodes-info.md
浏览文件 @ f51b016b
......@@ -108,9 +108,9 @@ query.select('#id').boundingClientRect(data => {
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|x|√|x|x|x|√|
**callback 返回参数**
......@@ -141,4 +141,52 @@ view.boundingClientRect(data => {
console.log("得到布局位置信息" + JSON.stringify(data));
console.log("节点离页面顶部的距离为" + data.top);
}).exec();
```
\ No newline at end of file
```
**注意**
- nvue 暂不支持 uni.createSelectorQuery，暂时使用下面的方案
```
<template>
<view class="wrapper">
<view ref="box" class="box">
<text class="info">Width: {{size.width}}</text>
<text class="info">Height: {{size.height}}</text>
<text class="info">Top: {{size.top}}</text>
<text class="info">Bottom: {{size.bottom}}</text>
<text class="info">Left: {{size.left}}</text>
<text class="info">Right: {{size.right}}</text>
</view>
</view>
</template>
<script>
// 注意平台差异
// #ifdef APP-NVUE
const dom = weex.requireModule('dom')
// #endif
export default {
data () {
return {
size: {
width: 0,
height: 0,
top: 0,
bottom: 0,
left: 0,
right: 0
}
}
},
onReady () {
const result = dom.getComponentRect(this.$refs.box, option => {
console.log('getComponentRect:', option)
this.size = option.size
})
console.log('return value:', result)
console.log('viewport:', dom.getComponentRect('viewport'))
}
}
</script>
```
docs/api/ui/pulldown.md
浏览文件 @ f51b016b
......@@ -77,7 +77,7 @@ export default {
### FAQ
Q：如何暂时禁用掉下拉刷新，待需要的时候再重新开启？
A：`5+App` 平台下可以处理此类场景，详细参考：[uni-app 中实现动态禁用/开启下拉刷新](https://ask.dcloud.net.cn/article/35134)
A：`App` 平台下可以处理此类场景，详细参考：[uni-app 中实现动态禁用/开启下拉刷新](https://ask.dcloud.net.cn/article/35134)
Q：自定义title如何让下拉刷新在title之下
A：App和H5端使用circle方式的下拉刷新，设offset在title高度之下。hello uni-app的模板-导航栏中有示例。小程序端无法实现，除非放弃原生下拉刷新，自己模拟下拉刷新，插件市场有类似插件，但性能不如原生下拉刷新。
......
docs/api/ui/tabbar.md
浏览文件 @ f51b016b
......@@ -4,9 +4,9 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -37,9 +37,9 @@ uni.setTabBarItem({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -70,9 +70,9 @@ uni.setTabBarStyle({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -89,9 +89,9 @@ uni.setTabBarStyle({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -107,9 +107,9 @@ uni.setTabBarStyle({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -135,9 +135,9 @@ uni.setTabBarBadge({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -153,9 +153,9 @@ uni.setTabBarBadge({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......@@ -171,9 +171,9 @@ uni.setTabBarBadge({
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
**OBJECT参数说明：**
......
docs/api/ui/window.md
浏览文件 @ f51b016b
......@@ -5,9 +5,9 @@
**平台差异说明**
|5+App|H5|微信小程序 |支付宝小程序|百度小程序|头条小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|
|√(nvue不支持)|√|√|x|x|x|
|5+App|H5|微信小程序 |支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√(nvue不支持)|√|√|x|x|x|√|
**CALLBACK 参数说明**
......
docs/api/worder.md 已删除 100644 → 0
浏览文件 @ dec383e0
#### Worker
仅微信小程序平台支持，[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/worker/wx.createWorker.html)
\ No newline at end of file
docs/api/worker.md 0 → 100644
浏览文件 @ f51b016b
#### Worker
目前需分平台编写
- 微信小程序：[规范详情](https://developers.weixin.qq.com/miniprogram/dev/api/worker/wx.createWorker.html)
- 头条小程序：[规范详情](https://developer.toutiao.com/docs/game/worker/tt.createWorker.html)
- QQ小程序：[规范详情](https://q.qq.com/wiki/develop/miniprogram/API/worker/worker.html)
\ No newline at end of file
docs/case.md
浏览文件 @ f51b016b
uni-app编译到App时，使用了DCloud的5+App引擎，该引擎跨iOS和Android，拥有众多案例，上线4年来产生几十万个App，有2亿手机用户在使用基于5+引擎开发的应用。详见[https://dcloud.io/case/](https://dcloud.io/case/)
如特别关心App端案例，注意uni-app编译到App时，使用了DCloud的5+App引擎，拥有众多案例（包括中国邮政、中国工商、湖北银行、360等），有2亿手机用户在使用基于5+引擎开发的应用。详见[https://dcloud.io/case/](https://dcloud.io/case/)
uni-app已经有几十万开发者，创建了几十万个项目，是开发者数量和案例最丰富的多端开发框架。
我们相信还有更多优秀案例，没有被我们采集到，欢迎大家到[项目案例征集](//github.com/dcloudio/uni-app/issues/6)提交。
uni-app已经有几十万开发者，是开发者数量和案例最丰富的多端开发框架。
我们相信还有更多优秀案例，没有被我们采集到，欢迎大家到[项目案例征集](https://github.com/dcloudio/uni-app/issues/6)提交。
### 官方示例
<a href="//m3w.cn/uniapp" target="_blank" class="clear-style"><b>Hello uni-app：</b></a>演示uni-app框架的组件、接口、模板，可以使用手机扫描下方App码下载iOS、Android原生安装包，也可以使用微信扫描小程序码，体验uni-app的小程序版本。本项目源码在HBuilderX中新建项目可获得。
<a href="//m3w.cn/uniapp" target="_blank" class="clear-style"><b>Hello uni-app：</b></a>演示uni-app框架的组件、接口、模板，可以使用手机扫描下方App码下载iOS、Android原生安装包，也可以使用微信扫描小程序码，体验uni-app的小程序版本。本项目源码可在HBuilderX中新建项目获得，也可从[github](https://github.com/dcloudio/hello-uniapp)上获取。
<div style="display:flex;justify-content: space-around;">
<a href="//m3w.cn/uniapp" target="_blank" class="clear-style barcode-view">
<img src="//img.cdn.aliyun.dcloud.net.cn/guide/uniapp/app_download.png" width="200"/>
......@@ -50,7 +50,7 @@ uni-app已经有几十万开发者，创建了几十万个项目，是开发者
<a href="https://www.oschina.net/" target="_blank" class="clear-style"><b>开源中国：</b></a> 中文开源技术交流社区，提供最新的开源软件资讯。
<div style="display:flex;justify-content: space-around;">
<a href="javascript:;" target="_blank" class="clear-style barcode-view">
<img src="http://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/oschina_weixin.jpg" width="200"/>
<img src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/oschina_weixin.jpg" width="200"/>
<span style="margin-top:15px;">微信小程序码</span>
</a>
<a href="javascript:;" target="_blank" class="clear-style barcode-view">
......@@ -98,11 +98,11 @@ uni-app已经有几十万开发者，创建了几十万个项目，是开发者
<span style="margin-top:15px;">百度小程序码</span>
</a>
<a href="https://www.cyb520.com/" target="_blank" class="clear-style barcode-view">
<img src="https://img.cyb520.com/faceImg/2019/08/17/130C1F3F-2E93-A55D-D6B2-074BEBE1902F.png/a120" width="200"/>
<img src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/cyb-qq.jpg" width="200"/>
<span style="margin-top:15px;">QQ小程序码</span>
</a>
<a href="https://www.cyb520.com/" target="_blank" class="clear-style barcode-view">
<img src="https://img.cyb520.com/faceImg/2019/08/17/404C2595-2B08-D471-1317-6D5375F195C5.png/a120" width="200"/>
<img src="https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/cyb-toutiao.png" width="200"/>
<span style="margin-top:15px;">头条/抖音小程序码</span>
</a>
</div>
......@@ -145,6 +145,8 @@ uni-app已经有几十万开发者，创建了几十万个项目，是开发者
**极志愿：**专业高考志愿填报。**<span style="color:#42b983">多端获客典型案例，1个月获得400万用户</span>**，[详见报道](https://mp.weixin.qq.com/s?__biz=MzU3NTU5NDc0NA==&mid=2247491214&idx=1&sn=7e334d079146d9e31cea407f45bd8624&chksm=fd219719ca561e0f9a85b30017618eaf9551b46cdd6ecdf856bc4e47aee4ca93767fcf23147f&mpshare=1&scene=1&srcid=0713VwAOIuRllzMB6syoQssb&key=15a2b72b2464b4fe73325967f733ac332583d5db37f1812c63613c083a8f5921bca2ada2140d45e07657b062dc451f27cc48fe4fd298f6456f300895a90bd471480afdc2c8dc5a45254fb1dc48d3b79a&ascene=1&uin=MTkzNjMxMzU%3D&devicetype=Windows+10&version=62060833&lang=zh_CN&pass_ticket=xW6dPp%2F565g5S8hl1lz%2F8FLQBEzW6KUHyyqyHPdT2nk%3D)。体验方式：[App、微信小程序、百度小程序、H5 官网地址](https://www.jizhy.com/home/)
**中华英才网：** 百度小程序搜索“中华英才网”
**联想集团官方小程序：** 微信小程序搜索 “联想集团”
**张亮麻辣烫：** 百度小程序搜索 “张亮麻辣烫”
......@@ -161,16 +163,20 @@ uni-app已经有几十万开发者，创建了几十万个项目，是开发者
**浙江ETC：**微信小程序搜索 “浙江ETC”、支付宝小程序搜索 “浙江ETC”、[H5](https://issue.zjetc.cn/)
**中国银联云闪付：** App部分页面使用uni-app制作
**拉卡拉收款宝：** App部分页面使用uni-app制作
**香橙：** 餐馆SaaS服务，手机点餐、下单、排队叫号、营销推广。[官网](http://ivcvc.com)
**波比英语课堂：**幼儿英语启蒙神器培养国际宝宝。[App、小程序通用链接](//m3w.cn/bbyykt)
**围棋战场：**围棋对弈，游戏类的小程序（非小游戏）。[微信小程序码](https://user-images.githubusercontent.com/16237216/65005363-327a9f80-d932-11e9-9be6-68cdbcdfdbf1.png)
**课呱呱：**在线学习好工作。[App、小程序、H5通用链接](//m3w.cn/__uni__b19209a)
**波比英语课堂：**幼儿英语启蒙神器培养国际宝宝。[App、小程序通用链接](http://m3w.cn/bbyykt)
**桂聘：** 广西区域招聘，随时随地找工作，[Android和iOS](http://www.guipin.com/jihui/)
**课呱呱：**在线学习好工作。[App、小程序、H5通用链接](http://m3w.cn/__uni__b19209a)
**阿拉运：** 物流行业app，nvue案例，[iOS和Android下载页](http://mb.ialayun.com/)
**财金宝：** 多端理财记账工具，[iOS](https://itunes.apple.com/cn/app/%E8%B4%A2%E9%87%91%E5%AE%9D-%E8%AE%B0%E8%B4%A6%E7%90%86%E8%B4%A2%E8%B5%84%E4%BA%A7%E7%AE%A1%E5%AE%B6/id1275489865?mt=8)、[Android](https://android.myapp.com/myapp/detail.htm?apkName=me.caijinbao.jlm)、微信小程序、支付宝小程序搜索“财金宝”
......@@ -439,6 +445,24 @@ uni-app已经有几十万开发者，创建了几十万个项目，是开发者
**垃圾分类帮帮团：** [微信小程序码地址](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/ljfl.png)
**FUNSOLE：**Funsole疯收是一个专业的球鞋交易平台。[App和小程序通用链接](https://m3w.cn/funsole)
**自由职业助手：**[微信小程序码](https://user-images.githubusercontent.com/34791472/60387434-b6608080-9ad5-11e9-8d5d-bc9f91e740ce.jpg)
**拾阅草堂：**网络小说。[微信小程序码](https://user-images.githubusercontent.com/12842804/61346867-371ccc00-a88d-11e9-8386-18e27677869c.png)
**千家找房：**二手房、新房买卖租赁平台。各大应用商城搜索“千家找房”下载APP、[H5](https://m.allqj.com)、[微信小程序二维码](https://user-images.githubusercontent.com/31872878/62843602-a3081e00-bced-11e9-8a2d-3f997be6cacf.png)
**坤典智慧农场：**体验农村种植、养殖的生活，足不出户就可以租地种植自己的蔬菜了，养殖鸡鸭牛羊，通过视频远程查看。[iOS码](https://user-images.githubusercontent.com/29654065/63156422-3cfdfc80-c047-11e9-8c41-23d298279466.jpg)、[Android码](https://user-images.githubusercontent.com/29654065/63156422-3cfdfc80-c047-11e9-8c41-23d298279466.jpg)、[微信小程序码](https://user-images.githubusercontent.com/29654065/63156422-3cfdfc80-c047-11e9-8c41-23d298279466.jpg)、[H5码](https://user-images.githubusercontent.com/29654065/63156422-3cfdfc80-c047-11e9-8c41-23d298279466.jpg)
**指动全城：**一个为宝宝选择好产品的线上渠道。[App和小程序通用链接](https://m3w.cn/__uni__6020544)
**极客修：**专门修手机的小程序。微信、支付宝搜索 极客修 小程序
**小米手环4自定义表盘软件：** [Android](https://www.coolapk.com/apk/tech.pingx.watchface)、[H5](http://watchface.pingx.tech/h5/)
**斗豆侠：**购物App。[iOS](https://apps.apple.com/cn/app/id1395120441)、[Android](https://obs.myhwclouds.com/vipbean/xgyx_guns/APK/yq.apk)
#### 更多小程序案例（可在微信小程序中搜索）@wx-more
......
docs/collocation/App.md 0 → 100644
浏览文件 @ f51b016b
`App.vue`是我们的主组件，所有页面都是在`App.vue`下进行切换的，是页面入口文件。
在这个文件里，你可以初始化一些通用的组件，调用一些应用生命周期函数。
应用生命周期仅可在`App.vue`中监听，在其它页面监听无效。
### 应用生命周期
`uni-app` 支持如下应用生命周期函数：
|函数名 |说明 |
|:- |:- |
|onLaunch |当`uni-app` 初始化完成时触发（全局只触发一次） |
|onShow |当 `uni-app` 启动，或从后台进入前台显示 |
|onHide |当 `uni-app` 从前台进入后台 |
|onUniNViewMessage|对 `nvue` 页面发送的数据进行监听，可参考 [nvue 向 vue 通讯](/use-weex?id=nvue-向-vue-通讯) |
在`App.vue`文件里使用生命周期函数，如下：
```html
<script>
export default {
onLaunch: function() {
console.log('App Launch')
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
}
}
</script>
```
**注意**
- **应用生命周期仅可在`App.vue`中监听，在其它页面监听无效**。
- onlaunch里进行页面跳转，如遇白屏报错，请参考[https://ask.dcloud.net.cn/article/35942](https://ask.dcloud.net.cn/article/35942)
- `App.vue` 不能写模板
### globalData
小程序有globalData机制，这套机制在uni-app里也可以使用，全端通用。
**以下是 App.vue 中定义globalData的相关配置：**
```html
<script>
export default {
globalData: {
text: 'text'
}
}
</script>
```
js中操作globalData的方式如下：
`getApp().globalData.text = 'test'`
如果需要把globalData的数据绑定到页面上，可在页面的onShow页面生命周期里进行变量重赋值。HBuilderX 2.0.3起，nvue页面在`uni-app`编译模式下，也支持onShow。
weex编译模式中使用globalData的话，由于weex生命周期不支持onShow，但熟悉5+的话，可利用监听webview的addEventListener show事件实现onShow效果，或者直接使用weex生命周期中的beforeCreate。
### 全局样式
在`App.vue`中，可以一些定义全局通用样式，例如需要加一个通用的背景色，首屏页面渲染的动画等都可以写在App.vue中。
**例如：**
现在有个页面背景是深色在vue页面中，可能会发生新窗体刚开始动画时是灰白色背景，动画结束时才变为深色背景，造成闪屏。这种情况就可以使用全局样式来解决。
- 造成这种现象的原因是因为webview的背景生效太慢。此时可将样式写在 `App.vue` 里，来加速页面样式的渲染速度。因为`App.vue` 里面的样式是全局样式，每次新开页面会优先加载 `App.vue` 里面的样式，然后加载普通 vue 页面的样式去覆盖`App.vue` 里面的样式。
- 另外nvue页面不存在此问题，也可以更改为nvue页面。
docs/collocation/_sidebar.md
浏览文件 @ f51b016b
......@@ -4,10 +4,12 @@
* [package.json](collocation/package.md)
* [vue-config.js](collocation/vue-config.md)
* [uni.scss](collocation/uni-scss.md)
* [App.vue](collocation/App.md)
* [main.js](collocation/main.md)
* 框架接口
* [日志打印](collocation/frame/log.md)
* [定时器](collocation/frame/timer.md)
* [生命周期](collocation/frame/lifetime.md)
* [生命周期](collocation/frame/lifecycle.md)
* [页面](collocation/frame/window.md)
* [页面通讯](collocation/frame/communication.md)
<li></li>
......
docs/collocation/frame/lifetime.md → docs/collocation/frame/lifecycle.md
浏览文件 @ f51b016b
### 应用生命周期
``uni-app`` 支持如下应用生命周期函数：
|函数名|说明|
|:-|:-|
|onLaunch|当``uni-app`` 初始化完成时触发（全局只触发一次）|
|onShow|当 ``uni-app`` 启动，或从后台进入前台显示|
|onHide|当 ``uni-app`` 从前台进入后台|
|onUniNViewMessage|对 ``nvue`` 页面发送的数据进行监听，可参考 [nvue 向 vue 通讯](/use-weex?id=nvue-向-vue-通讯)|
**注意**
- 应用生命周期仅可在``App.vue``中监听，在其它页面监听无效。
- onlaunch里进行页面跳转，如遇白屏报错，请参考[https://ask.dcloud.net.cn/article/35942](https://ask.dcloud.net.cn/article/35942)
### 页面生命周期
``uni-app`` 支持如下页面生命周期函数：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|onLoad|监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参），参考[示例](/api/router?id=navigateto)|||
|onShow|监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面|||
|onReady|监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发|||
|onHide|监听页面隐藏|||
### 应用生命周期
``uni-app`` 支持如下应用生命周期函数：
|函数名|说明|
|:-|:-|
|onLaunch|当``uni-app`` 初始化完成时触发（全局只触发一次）|
|onShow|当 ``uni-app`` 启动，或从后台进入前台显示|
|onHide|当 ``uni-app`` 从前台进入后台|
|onUniNViewMessage|对 ``nvue`` 页面发送的数据进行监听，可参考 [nvue 向 vue 通讯](/use-weex?id=nvue-向-vue-通讯)|
**注意**
- 应用生命周期仅可在``App.vue``中监听，在其它页面监听无效。
**示例代码**
```html
<script>
// 只能在App.vue里监听应用的生命周期
export default {
onLaunch: function() {
console.log('App Launch')
},
onShow: function() {
console.log('App Show')
},
onHide: function() {
console.log('App Hide')
}
}
</script>
```
### 页面生命周期
``uni-app`` 支持如下页面生命周期函数：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|onLoad|监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参），参考[示例](/api/router?id=navigateto)|||
|onShow|监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面|||
|onReady|监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发|||
|onHide|监听页面隐藏|||
|onUnload|监听页面卸载|||
|onResize|监听窗口尺寸变化|5+App、微信小程序||
|onPullDownRefresh|监听用户下拉动作，一般用于下拉刷新，参考[示例](api/ui/pulldown)|||
|onReachBottom|页面滚动到底部的事件（不是scroll-view滚到底），常用于下拉下一页数据。具体见下方注意事项|||
|onTabItemTap|点击 tab 时触发，参数为Object，具体见下方注意事项|微信小程序、百度小程序、H5、5+App（自定义组件模式）||
|onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序||
|onPageScroll|监听页面滚动，参数为Object|||
|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||
|onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|5+App、H5|1.6.0|
|onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。|5+App、H5|1.6.0|
|onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|5+App、H5|1.6.0|
``onReachBottom``使用注意
可在pages.json里定义具体页面底部的触发距离[onReachBottomDistance](/collocation/pages)，比如设为50，那么滚动页面到距离底部50px时，就会触发onReachBottom事件。
如使用scroll-view导致页面没有滚动，则触底事件不会被触发。scroll-view滚动到底部的事件请参考scroll-view的文档
``onPageScroll`` （监听滚动、滚动监听、滚动事件）参数说明：
|属性|类型|说明|
|---|---|---|
|scrollTop|Number|页面在垂直方向已滚动的距离（单位px）|
**注意**
- `onPageScroll`里不要写交互复杂的js，比如频繁修改页面。因为这个生命周期是在渲染层触发的，js是在逻辑层执行的，两层之间通信是有损耗的。如果在滚动过程中，频发触发两层之间的数据交换，可能会造成卡顿。
``onTabItemTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|String|被点击tabItem的序号，从0开始|
|pagePath|String|被点击tabItem的页面路径|
|text|String|被点击tabItem的按钮文字|
**注意**
- onTabItemTap常用于点击当前tabitem，滚动或刷新当前页面。如果是点击不同的tabitem，一定会触发页面切换。
- 如果想在App端实现点击某个tabitem不跳转页面，不能使用onTabItemTap，可以使用[plus.nativeObj.view](http://www.html5plus.org/doc/zh_cn/nativeobj.html)放一个区块盖住原先的tabitem，并拦截点击事件。
- onTabItemTap在App端，从HBuilderX 1.9 的自定义组件编译模式开始支持。
``onNavigationBarButtonTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|Number|原生标题栏按钮数组的下标|
`onBackPress` 回调参数对象说明：
|属性|类型|说明|
|---|---|---|
|from|String|触发返回行为的来源：'backbutton'——左上角导航栏按钮及安卓返回键；'navigateBack'——uni.navigateBack() 方法。|
```javascript
export default {
data() {
return {};
},
onBackPress(options) {
console.log('from:' + options.from)
}
}
```
### 组件生命周期
``uni-app`` 组件支持如下页面生命周期函数：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|beforeCreate|在实例初始化之后被调用。[详见](https://cn.vuejs.org/v2/api/#beforeCreate)|||
|created|在实例创建完成后被立即调用。[详见](https://cn.vuejs.org/v2/api/#created)|||
|beforeMount|在挂载开始之前被调用。[详见](https://cn.vuejs.org/v2/api/#beforeMount)|||
|mounted|挂载到实例上去之后调用。[详见](https://cn.vuejs.org/v2/api/#mounted) 注意：此处并不能确定子组件被全部挂载，如果需要子组件完全挂载之后在执行操作可以使用```$nextTick```[Vue官方文档](https://cn.vuejs.org/v2/api/#Vue-nextTick)|||
|onResize|监听窗口尺寸变化|App、微信小程序||
|onPullDownRefresh|监听用户下拉动作，一般用于下拉刷新，参考[示例](api/ui/pulldown)|||
|onReachBottom|页面滚动到底部的事件（不是scroll-view滚到底），常用于下拉下一页数据。具体见下方注意事项|||
|onTabItemTap|点击 tab 时触发，参数为Object，具体见下方注意事项|微信小程序、百度小程序、H5、App（自定义组件模式）||
|onShareAppMessage|用户点击右上角分享|微信小程序、百度小程序、头条小程序、支付宝小程序||
|onPageScroll|监听页面滚动，参数为Object|nvue暂不支持||
|onNavigationBarButtonTap|监听原生标题栏按钮点击事件，参数为Object|App、H5||
|onBackPress|监听页面返回，返回 event = {from:backbutton、 navigateBack} ，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack ；详细说明及使用：[onBackPress 详解](http://ask.dcloud.net.cn/article/35120)|app、H5||
|onNavigationBarSearchInputChanged|监听原生标题栏搜索输入框输入内容变化事件|App、H5|1.6.0|
|onNavigationBarSearchInputConfirmed|监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。|App、H5|1.6.0|
|onNavigationBarSearchInputClicked|监听原生标题栏搜索输入框点击事件|App、H5|1.6.0|
``onReachBottom``使用注意
可在pages.json里定义具体页面底部的触发距离[onReachBottomDistance](/collocation/pages)，比如设为50，那么滚动页面到距离底部50px时，就会触发onReachBottom事件。
如使用scroll-view导致页面没有滚动，则触底事件不会被触发。scroll-view滚动到底部的事件请参考scroll-view的文档
``onPageScroll`` （监听滚动、滚动监听、滚动事件）参数说明：
|属性|类型|说明|
|---|---|---|
|scrollTop|Number|页面在垂直方向已滚动的距离（单位px）|
**注意**
- `onPageScroll`里不要写交互复杂的js，比如频繁修改页面。因为这个生命周期是在渲染层触发的，在非h5端，js是在逻辑层执行的，两层之间通信是有损耗的。如果在滚动过程中，频发触发两层之间的数据交换，可能会造成卡顿。
- 如果想实现滚动时标题栏透明渐变，在App和H5下，可在pages.json中配置titleNView下的type为transparent，[参考](https://uniapp.dcloud.io/collocation/pages?id=app-titlenview)。
- 如果需要滚动吸顶固定某些元素，推荐使用css的粘性布局，参考[插件市场](https://ext.dcloud.net.cn/plugin?id=715)。插件市场也有其他js实现的吸顶插件，但性能不佳，需要时可自行搜索。
- 在App、微信小程序、H5中，也可以使用wxs监听滚动，[参考](https://uniapp.dcloud.io/frame?id=wxs)；在app-nvue中，可以使用bindingx监听滚动，[参考](https://uniapp.dcloud.io/use-weex?id=nvue-%e9%87%8c%e4%bd%bf%e7%94%a8-bindingx)。
```js
onPageScroll : function(e) { //nvue暂不支持滚动监听，可用bindingx代替
console.log("滚动距离为：" + e.scrollTop);
},
```
``onTabItemTap`` 返回的json对象说明：
|属性|类型|说明|
|---|---|---|
|index|String|被点击tabItem的序号，从0开始|
|pagePath|String|被点击tabItem的页面路径|
|text|String|被点击tabItem的按钮文字|
**注意**
- onTabItemTap常用于点击当前tabitem，滚动或刷新当前页面。如果是点击不同的tabitem，一定会触发页面切换。
- 如果想在App端实现点击某个tabitem不跳转页面，不能使用onTabItemTap，可以使用[plus.nativeObj.view](http://www.html5plus.org/doc/zh_cn/nativeobj.html)放一个区块盖住原先的tabitem，并拦截点击事件。
```js
onTabItemTap : function(e) {
console.log(e);
// e的返回格式为json对象： {"index":0,"text":"首页","pagePath":"pages/index/index.html"}
},
```
``onNavigationBarButtonTap`` 参数说明：
|属性|类型|说明|
|---|---|---|
|index|Number|原生标题栏按钮数组的下标|
```js
onNavigationBarButtonTap : function (e) {
console.log(e);
// e的返回格式为json对象：{"text":"测试","index":0}
}
```
`onBackPress` 回调参数对象说明：
|属性|类型|说明|
|---|---|---|
|from|String|触发返回行为的来源：'backbutton'——左上角导航栏按钮及安卓返回键；'navigateBack'——uni.navigateBack() 方法。|
```javascript
export default {
data() {
return {};
},
onBackPress(options) {
console.log('from:' + options.from)
}
}
```
**注意**
- nvue 页面weex编译模式支持的生命周期同weex，具体参考：[weex生命周期介绍](/use-weex?id=生命周期)。
### 组件生命周期
``uni-app`` 组件支持的生命周期，与vue标准组件的生命周期相同。这里没有页面级的onLoad等生命周期：
|函数名|说明|平台差异说明|最低版本|
|:-|:-|:-|:-|
|beforeCreate|在实例初始化之后被调用。[详见](https://cn.vuejs.org/v2/api/#beforeCreate)|||
|created|在实例创建完成后被立即调用。[详见](https://cn.vuejs.org/v2/api/#created)|||
|beforeMount|在挂载开始之前被调用。[详见](https://cn.vuejs.org/v2/api/#beforeMount)|||
|mounted|挂载到实例上去之后调用。[详见](https://cn.vuejs.org/v2/api/#mounted) 注意：此处并不能确定子组件被全部挂载，如果需要子组件完全挂载之后在执行操作可以使用```$nextTick```[Vue官方文档](https://cn.vuejs.org/v2/api/#Vue-nextTick)|||
|beforeUpdate|数据更新时调用，发生在虚拟 DOM 打补丁之前。[详见](https://cn.vuejs.org/v2/api/#beforeUpdate)|仅H5平台支持||
|updated|由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。[详见](https://cn.vuejs.org/v2/api/#updated)|仅H5平台支持||
|beforeDestroy|实例销毁之前调用。在这一步，实例仍然完全可用。[详见](https://cn.vuejs.org/v2/api/#beforeDestroy)|||
|destroyed|Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。[详见](https://cn.vuejs.org/v2/api/#destroyed)|||
**注意**
- nvue 页面支持的生命周期参考：[nvue 生命周期介绍](/use-weex?id=生命周期)。
\ No newline at end of file
|updated|由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。[详见](https://cn.vuejs.org/v2/api/#updated)|仅H5平台支持||
|beforeDestroy|实例销毁之前调用。在这一步，实例仍然完全可用。[详见](https://cn.vuejs.org/v2/api/#beforeDestroy)|||
|destroyed|Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。[详见](https://cn.vuejs.org/v2/api/#destroyed)|||
docs/collocation/main.md 0 → 100644
浏览文件 @ f51b016b
`main.js`是我们的入口文件，主要作用是初始化`vue`实例并使用需要的插件。
首先引入了`Vue`库和`App.vue`，创建了一个`vue`实例，并且挂载`vue`实例。
```
import Vue from 'vue'
import App from './App'
import pageHead from './components/page-head.vue' //引用page-head组件
Vue.config.productionTip = false
Vue.component('page-head', pageHead) //全局注册page-head组件
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount() //挂载Vue实例
```
也可以引用`vuex`，使用`Vue.use`引用插件，使用`Vue.prototype`添加全局变量，使用`Vue.component`注册全局组件。
不过无法使用`vue-router`，路由须在`pages.json`中进行配置。
**注意**
- nvue 暂不支持在 main.js 注册全局组件
docs/collocation/manifest.md
浏览文件 @ f51b016b
......@@ -296,7 +296,7 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
|resizable|Boolean|在iPad上小程序是否支持屏幕旋转，默认关闭|
|navigateToMiniProgramAppIdList|Array|需要跳转的小程序列表，[详见](https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html)|
|permission|Object|微信小程序接口权限相关设置，比如申请位置权限必须填此处[详见](https://developers.weixin.qq.com/miniprogram/dev/framework/config.html)|
|workers|String|Worker 代码放置的目录，**HBuilderX 2.0.0+ Alpha** 支持。 [详见](https://developers.weixin.qq.com/miniprogram/dev/framework/workers.html)|
|workers|String|Worker 代码放置的目录。 [详见](https://developers.weixin.qq.com/miniprogram/dev/framework/workers.html)|
#### setting
......@@ -321,6 +321,8 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
|:-|:-|:-|
|appid|String|百度小程序的 AppID，登录 [https://smartprogram.baidu.com/docs/introduction/enter_application/](https://smartprogram.baidu.com/docs/introduction/enter_application/) 申请|
|usingComponents|Boolean| 是否启用自定义组件模式，`v2.0+`，默认为false，[编译模式区别详情](https://ask.dcloud.net.cn/article/35843)|
|requiredBackgroundModes|Array|小程序需要在后台使用的能力，目前支持背景音频播放，"requiredBackgroundModes": ["audio"]，[详见](https://smartprogram.baidu.com/docs/develop/tutorial/process/#requiredBackgroundModes) |
|prefetches|Array|预请求的所有url的列表，[详见](https://smartprogram.baidu.com/docs/develop/tutorial/process/#prefetches) |
### mp-toutiao
......@@ -329,6 +331,7 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
|appid|String|头条小程序的 AppID，登录 [https://developer.toutiao.com/](https://developer.toutiao.com/) 申请|
|setting|Object|头条小程序项目设置，参考[头条小程序项目设置](/collocation/manifest?id=mp-toutiao-setting)|
|usingComponents|Boolean| 是否启用自定义组件模式，`v2.0+`，默认为false，[编译模式区别详情](https://ask.dcloud.net.cn/article/35843)|
|navigateToMiniProgramAppIdList |Array|需要跳转的小程序列表，[详见](https://developer.toutiao.com/docs/framework/globalSetting.html#%E5%85%A8%E5%B1%80%E9%85%8D%E7%BD%AE) |
#### 头条小程序项目设置@mp-toutiao-setting
......@@ -341,10 +344,16 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
### mp-qq
|属性|类型|说明|
|:-|:-|:-|
|appid|String|qq 小程序的 AppID，登录 [https://q.qq.com](https://q.qq.com) 申请|
|usingComponents|Boolean| 是否启用自定义组件模式，`v2.0+`，默认为false，[编译模式区别详情](https://ask.dcloud.net.cn/article/35843)。mp-qq只支持自定义组件模式|
|属性 |类型 |说明 |
|:- |:- |:- |
|appid |String |qq 小程序的 AppID，登录 [https://q.qq.com](https://q.qq.com) 申请 |
|requiredBackgroundModes |Array |小程序需要在后台使用的能力，目前支持背景音频播放，"requiredBackgroundModes": ["audio"]，[详见](https://q.qq.com/wiki/develop/miniprogram/frame/dispose.html#requiredbackgroundmodes) |
|navigateToMiniProgramAppIdList |Array |需要跳转的小程序列表，[详见](https://q.qq.com/wiki/develop/miniprogram/frame/dispose.html#navigatetominiprogramappidlist) |
|permission |Object |小程序接口权限相关设置，比如申请位置权限必须填此处[详见](https://q.qq.com/wiki/develop/miniprogram/frame/dispose.html#permission) |
|workers |String |Worker 代码放置的目录。 [详见](https://q.qq.com/wiki/develop/miniprogram/frame/dispose.html#workers) |
|groupIdList |String Array |需要打开群资料卡的群号列表，详见button的open-type |
mp-qq只支持自定义组件模式，不存在usingComponents配置
### 完整 manifest.json
......@@ -482,8 +491,7 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
"share": {
// 微信分享
"weixin": {
"appid": "",
"appsecret": ""
"appid": ""
},
// 新浪微博分享
"sina": {
......@@ -491,15 +499,9 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
"appsecret": "",
"redirect_uri": ""
},
// 分享到QQ好友
// 分享到QQ
"qq": {
"appid": ""
},
// 腾讯微博分享
"tencent": {
"appkey": "",
"appsecret": "",
"redirect_uri": ""
}
},
"statics": {
......@@ -512,6 +514,7 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
}
}
},
// 屏幕方向
"orientation": [
"portrait-primary",
"landscape-primary",
......@@ -634,7 +637,8 @@ Tips：关于摇树优化（treeShaking）原理及优化结果，参考：[http
"softinput": {
"navBar": "auto", //是否显示iOS软键盘上的“完成”导航条
"mode": "adjustResize|adjustPan" //软键盘弹出模式，
}
},
"popGesture": "none" //iOS上是否支持屏幕左边滑动关闭当前页面。默认是可关闭。设为none则不响应左滑动画。
},
// 快应用特有配置
"quickapp": {},
......
docs/collocation/pages.md
浏览文件 @ f51b016b
......@@ -75,7 +75,7 @@
用于设置应用的状态栏、导航条、标题、窗口背景色等。
|属性|类型|默认值|描述|平台差异说明|
|:-|:-|:-|:-||
|:-|:-|:-|:-|:-|
|navigationBarBackgroundColor|HexColor|#F7F7F7|导航栏背景颜色（同状态栏背景色）|APP与H5为#F7F7F7，小程序平台请参考相应小程序文档||
|navigationBarTextStyle|String|white|导航栏标题颜色及状态栏前景颜色，仅支持 black/white||
|navigationBarTitleText|String||导航栏标题文字内容||
......@@ -84,8 +84,11 @@
|backgroundTextStyle|String|dark|下拉 loading 的样式，仅支持 dark / light|微信小程序|
|enablePullDownRefresh|Boolean|false|是否开启下拉刷新，详见[页面生命周期](/use?id=页面生命周期)。||
|onReachBottomDistance|Number|50|页面上拉触底事件触发时距页面底部距离，单位只支持px，详见[页面生命周期](/use?id=页面生命周期)||
|backgroundColorTop|HexColor|#ffffff|顶部窗口的背景色。|仅 iOS 平台|
|backgroundColorBottom|HexColor|#ffffff|底部窗口的背景色。|仅 iOS 平台|
|backgroundColorTop|HexColor|#ffffff|顶部窗口的背景色（bounce回弹区域）|仅 iOS 平台|
|backgroundColorBottom|HexColor|#ffffff|底部窗口的背景色（bounce回弹区域）|仅 iOS 平台|
|titleImage|String||导航栏图片地址（替换当前文字标题），支付宝小程序内必须使用https的图片链接地址|支付宝小程序、H5、APP|
|transparentTitle|String|none|导航栏透明设置。支持 always 一直透明 / auto 滑动自适应 / none 不透明|支付宝小程序、H5、APP|
|titlePenetrate|String|NO|导航栏点击穿透|支付宝小程序、H5|
|pageOrientation|String|portrait|屏幕旋转设置，仅支持 auto / portrait 详见 [响应显示区域变化](https://developers.weixin.qq.com/miniprogram/dev/framework/view/resizable.html)|微信小程序|
|animationType|String|pop-in|窗口显示的动画效果，详见：[窗口动画](api/router?id=animation)|App|
|animationDuration|Number|300|窗口显示动画的持续时间，单位为 ms|App|
......@@ -98,6 +101,13 @@
|mp-qq|Object||设置编译到 mp-qq 平台的特定样式|QQ小程序|
|usingComponents|Object| |引用小程序组件，参考 [小程序组件](/frame?id=小程序组件支持)|微信小程序、App|
**注意**
- 支付宝小程序使用`titleImage`时必须使用`https`的图片链接地址，需要真机调试才能看到效果，支付宝开发者工具内无效果
- `globalStyle`中设置的`titleImage`也会覆盖掉`pages`->`style`内的设置文字标题
- navigationBarTextStyle 在iOS13上可能会错乱，此问题后续版本会修复
# pages
`uni-app` 通过 pages 节点配置应用由哪些页面组成，pages 节点接收一个数组，数组每个项都是一个对象，其属性值如下：
......@@ -165,8 +175,11 @@
|backgroundTextStyle|String|dark|下拉 loading 的样式，仅支持 dark/light||
|enablePullDownRefresh|Boolean|false|是否开启下拉刷新，详见[页面生命周期](/use?id=页面生命周期)。||
|onReachBottomDistance|Number|50|页面上拉触底事件触发时距页面底部距离，单位只支持px，详见[页面生命周期](/use?id=页面生命周期)||
|backgroundColorTop|HexColor|#ffffff|顶部窗口的背景色。|仅 iOS 平台|
|backgroundColorBottom|HexColor|#ffffff|底部窗口的背景色。|仅 iOS 平台|
|backgroundColorTop|HexColor|#ffffff|顶部窗口的背景色（bounce回弹区域）|仅 iOS 平台|
|backgroundColorBottom|HexColor|#ffffff|底部窗口的背景色（bounce回弹区域）|仅 iOS 平台|
|titleImage|String||导航栏图片地址（替换当前文字标题），支付宝小程序内必须使用https的图片链接地址|支付宝小程序、H5|
|transparentTitle|String|none|导航栏透明设置。支持 always 一直透明 / auto 滑动自适应 / none 不透明|支付宝小程序、H5、APP|
|titlePenetrate|String|NO|导航栏点击穿透|支付宝小程序、H5|
|app-plus|Object||设置编译到 App 平台的特定样式，配置项参考下方 [app-plus](/collocation/pages?id=app-plus)|App|
|h5|Object||设置编译到 H5 平台的特定样式，配置项参考下方 [H5](/collocation/pages?id=h5)|H5|
|mp-alipay|Object||设置编译到 mp-alipay 平台的特定样式，配置项参考下方 [MP-ALIPAY](/collocation/pages?id=mp-alipay)|支付宝小程序|
......@@ -193,6 +206,10 @@
```
**注意**
- 支付宝小程序使用`titleImage`时必须使用`https`的图片链接地址，需要真机调试才能看到效果，支付宝开发者工具内无效果
### 自定义导航栏使用注意@customnav
当navigationStyle设为custom或titleNView设为false时，原生导航栏不显示，此时要注意几个问题：
- 非H5端，手机顶部状态栏区域会被页面内容覆盖。这是因为窗体是沉浸式的原因，即全屏可写内容。uni-app提供了状态栏高度的css变量[--status-bar-height](/frame?id=css%e5%8f%98%e9%87%8f)，如果需要把状态栏的位置从前景部分让出来，可写一个占位div，高度设为css变量。
......@@ -236,7 +253,8 @@
|titleNView|Object||导航栏 ，详见:[导航栏](/collocation/pages?id=app-titleNView)|App、H5|
|subNVues|Object||原生子窗体，详见:[原生子窗体](/collocation/pages?id=app-subNVues)|App 1.9.10+|
|bounce|String||页面回弹效果，设置为 "none" 时关闭效果。|App（nvue Android暂无bounce效果）|
|softinputNavBar|String||iOS软键盘上完成工具栏的显示模式，设置为 "none" 时关闭工具栏。|仅ios生效|
|softinputNavBar|String|auto|iOS软键盘上完成工具栏的显示模式，设置为 "none" 时关闭工具栏。|仅ios生效|
|softinputMode|String|adjustPan|软键盘弹出模式，支持 adjustResize、adjustPan 两种模式|App|
|pullToRefresh|Object||下拉刷新|App|
|scrollIndicator|String||滚动条显示策略，设置为 "none" 时不显示滚动条。|App|
|animationType|String|pop-in|窗口显示的动画效果，详见：[窗口动画](api/router?id=animation)。|App|
......@@ -245,15 +263,15 @@
- `.nvue` 页面仅支持 `titleNView` 配置，其它配置项暂不支持
#### 导航栏@app-titleNView
|属性|类型|默认值|描述|最低版本|
|属性|类型|默认值|描述|版本兼容性|
|:-|:-|:-|:-|:-|
|backgroundColor|String|#F7F7F7|背景颜色，颜色值格式为"#RRGGBB"。||
|buttons|Array||自定义按钮，详见 [buttons](/collocation/pages?id=app-titlenview-buttons)||
|backgroundColor|String|#F7F7F7|背景颜色，颜色值格式为"#RRGGBB"。在使用半透明标题栏时，也可以设置rgba格式||
|buttons|Array||自定义按钮，详见 [buttons](/collocation/pages?id=app-titlenview-buttons)|纯nvue即render:native时暂不支持|
|titleColor|String|#000000|标题文字颜色||
|titleOverflow|String|ellipsis|标题文字超出显示区域时处理方式。"clip"-超出显示区域时内容裁剪；"ellipsis"-超出显示区域时尾部显示省略标记（...）。||
|titleText|String||标题文字内容||
|titleSize|String||标题文字字体大小||
|type|String|default|导航栏样式。"default"-默认样式；"transparent"-透明渐变。||
|type|String|default|导航栏样式。"default"-默认样式；"transparent"-滚动透明渐变；"float"-悬浮导航栏。||
|tags|Array||原生 View 增强，详见：[5+ View 控件](http://www.html5plus.org/doc/zh_cn/nativeobj.html#plus.nativeObj.ViewDrawTagStyles)||
|searchInput|Object||原生导航栏上的搜索框配置，详见：[searchInput](/collocation/pages?id=app-titlenview-searchinput)|1.6.0|
......@@ -261,8 +279,8 @@
- 每个页面均支持通过配置 `titleNView:false` 来禁用原生导航栏。一旦禁用原生导航，请注意阅读[自定义导航注意事项](/collocation/pages?id=customnav)。
- `titleNView` 不能设置 `autoBackButton`、`homeButton`等属性
- `titleNView` 的 `type` 值为 `transparent` 时，导航栏为透明渐变导航栏
- 在 `titleNView` 配置 `buttons` 后，监听按钮的点击事件，vue 页面参考：[onNavigationBarButtonTap](/frame?id=页面生命周期)、nvue 页面参考：[uni.onNavigationBarButtonTap](/use-weex?id=onnavigationbarbuttontap)
- `titleNView` 的 `type` 值为 `transparent` 时，导航栏为滚动透明渐变导航栏，默认只有button，滚动后标题栏底色和title文字会渐变出现； `type` 为 `float` 时，导航栏为悬浮标题栏，此时页面内容上顶到了屏幕顶部，包括状态栏，但导航栏悬浮盖在页面上方，一般这种场景会同时设置导航栏的背景色为rgba半透明颜色。
- 在 `titleNView` 配置 `buttons` 后，监听按钮的点击事件，vue 页面及 nvue 的uni-app编译模式参考：[onNavigationBarButtonTap](/frame?id=页面生命周期)、nvue 的weex编译模式参考：[uni.onNavigationBarButtonTap](/use-weex?id=onnavigationbarbuttontap)
- 在 `titleNView` 配置 `searchInput` 后，相关的事件监听参考：[onNavigationBarSearchInputChanged 等](/frame?id=页面生命周期)
- App下原生导航栏的按钮如果使用字体图标，注意检查字体库的名字（font-family）是否使用了默认的 iconfont，这个名字是保留字，不能作为外部引入的字体库的名字，需要调整为自定义的名称，否则无法显示。
- 想了解各种导航栏的开发方法，请详读[导航栏开发指南](https://ask.dcloud.net.cn/article/34921)
......@@ -387,10 +405,12 @@ searchInput的点击输入框onNavigationBarSearchInputClicked、文本变化onN
#### 原生子窗体@app-subNVues
`subNVues` 是 vue 页面的原生子窗体。用于解决 vue 页面中的层级覆盖和原生界面灵活自定义用的。
`subNVues` 是 vue 页面的原生子窗体。用于解决App中 vue 页面中的层级覆盖和原生界面灵活自定义用的。
它不是全屏页面，也不是组件，就是一个原生子窗体。它是一个 nvue 页面，使用 weex 引擎渲染，提供了比 cover-view、plus.nativeObj.view 更强大的原生排版能力，方便自定义原生导航或覆盖原生地图、视频等。请详读[subNVues 开发指南](http://ask.dcloud.net.cn/article/35948)
`subNVue` 也可以在 nvue 页面中使用。但目前在纯nvue下（render为native）还不支持。
|属性|类型|描述|
|:- |:- |:-|
|id|String| subNVue 原生子窗体的标识 |
......@@ -603,18 +623,18 @@ h5 平台下拉刷新动画，只有 circle 类型。
|属性|类型|默认值|描述|
|:-|:-|:-|:-|
|allowsBounceVertical|String|YES|是否允许向下拉拽。支持 YES / NO|
|titleImage|String||导航栏图片地址（替换当前文字标题），内必须使用https的图片链接地址|
|transparentTitle|String|none|导航栏透明设置。支持 always 一直透明 / auto 滑动自适应 / none 不透明|
|titlePenetrate|String|NO|导航栏点击穿透|
|showTitleLoading|String|NO|是否进入时显示导航栏的 loading。支持 YES / NO|
|titleImage|String||导航栏图片地址（替换当前标题），必须为https的图片链接地址|
|backgroundImageUrl|String||下拉露出显示的背景图链接|
|backgroundImageColor|HexColor||下拉露出显示的背景图底色|
|gestureBack|String|NO|iOS 用，是否支持手势返回。支持 YES / NO|
|titlePenetrate|String|NO|导航栏点击穿透|
|showTitleLoading|String|NO|是否进入时显示导航栏的 loading。支持 YES / NO|
|backgroundImageUrl|String||下拉露出显示的背景图链接|
|backgroundImageColor|HexColor||下拉露出显示的背景图底色|
|gestureBack|String|NO|iOS 用，是否支持手势返回。支持 YES / NO|
|enableScrollBar|String|YES|Android 用，是否显示 WebView 滚动条。支持 YES / NO|
**注意事项**
- ```titleImage```仅支持https地址，设置了```titleImage```会是页面```title```失效
- ```titleImage```仅支持https地址，设置了```titleImage```会替换页面文字标题
- ```backgroundImageUrl```支持网络地址和本地地址，尽量使用绝对地址
- 部分配置可能会只在真机运行的时候生效，支付宝未来应该会改善
......@@ -631,7 +651,7 @@ h5 平台下拉刷新动画，只有 circle 类型。
- tabBar 中的 list 是一个数组，只能配置最少2个、最多5个 tab，tab 按数组的顺序排序。
- tabbar 切换第一次加载时可能渲染不及时，可以在每个tabbar页面的onLoad生命周期里先弹出一个等待雪花（hello uni-app使用了此方式）
- tabbar 的页面展现过一次后就保留在内存中，再次切换 tabbar 页面，只会触发每个页面的onShow，不会再触发onLoad。
- 顶部的 tabbar 目前仅微信小程序上支持，需要用到顶部选项卡的话，参考 hello uni-app->模板->顶部选项卡。
- 顶部的 tabbar 目前仅微信小程序上支持。需要用到顶部选项卡的话，建议不使用 tabbar 的顶部设置，而是自己做顶部选项卡，可参考 hello uni-app->模板->顶部选项卡。
**属性说明：**
......@@ -658,14 +678,15 @@ h5 平台下拉刷新动画，只有 circle 类型。
- tabbar 的 item 点击事件见[页面生命周期的onTabItemTap](https://uniapp.dcloud.io/frame?id=%E9%A1%B5%E9%9D%A2%E7%94%9F%E5%91%BD%E5%91%A8%E6%9C%9F)。
- 代码跳转到tabbar页面，api只能使用[uni.switchTab](https://uniapp.dcloud.io/api/router?id=switchtab)，不能使用uni.navigateTo、uni.redirectTo；使用navigator组件跳转时必须设置[open-type="switchTab"](https://uniapp.dcloud.io/component/navigator)
- tabbar 在H5端是div模拟的，属于前端屏幕窗口的一部分，如果要使用bottom居底定位方式，应该使用css变量`--window-bottom`，比如悬浮在tabbar上方10px的按钮，样式如下`bottom: calc(var(--window-bottom) + 10px)`
- tabbar 的默认高度，在不同平台不一样。[详见](https://uniapp.dcloud.io/frame?id=%e5%9b%ba%e5%ae%9a%e5%80%bc)
- 中间带+号的tabbar模板例子，[参考](https://ext.dcloud.net.cn/plugin?id=98)。可跨端，但+号不凸起。
- 如需 tabbar 中间凸起，App端可使用plus.nativeObj.view，[参考](https://ask.dcloud.net.cn/article/35036)。H5端可使用view自绘。
- 如果不使用原生tabbar，在前端自己实现tabbar，在小程序和App端的性能体验不如原生tabbar。如果是多页方式，底部tabbar会在切换时闪一下，如果是单页方式，承载复杂页面内容会有性能问题。[插件市场](https://ext.dcloud.net.cn/search?q=tabbar)搜索tabbar有不少类似例子。
- App端使用nvue，可以不用这里的tabbar，自己做tabbar，没有性能体验问题。
- Android App上弹出键盘顶起tabbar的问题。如果是搜索框，建议点击后新开页面搜索（hello uni-app有例子）；也可以动态隐藏tabbar；也可以配置 manifest.json 中 app-plus->softinput->mode 设置为 adjustPan，注意仅打包后生效。[详见manifest配置](https://uniapp.dcloud.io/collocation/manifest?id=%E5%AE%8C%E6%95%B4-manifestjson)
- 原生的tabbar只有一个且在首页。二级页的tab，或者用前端实现，或者App端使用nvue。
- 如需 tabbar 中间凸起，可自定义tabbar，插件市场有例子，如colorUI等。但注意前端tabbar的性能不如原生tabbar，如果是多页方式，底部tabbar会在切换时闪执行转场动画，如果是单页方式，承载复杂页面内容会有性能问题。[插件市场](https://ext.dcloud.net.cn/search?q=tabbar)搜索tabbar有不少类似例子。
- App端若使用nvue，自定义tabbar，没有性能体验问题。
- 纯nvue项目（manifest里renderer为native），目前使用pages.json里的tabbar反而影响性能，建议使用前端自己实现单页面的tabbar。后续会解决这个bug。
- Android App上弹出键盘顶起tabbar的问题。升级到HBuilderX 2.2后不再存在。
- 原生的tabbar只有一个且在首页。二级页如需的tab，前端自己实现。
- 如果是需要先登录、后进入tab页面，不需要把登陆页设为首页，首页仍然是tabbar页，可参考HBuilderX新建uni-app项目时的登陆模板
- 前端弹出遮罩层挡不住tabbar的问题，跨端处理方式时动态隐藏tabbar。App端可以使用plus.nativeObj.view做弹出和遮罩，可参考这个[底部原生图标分享菜单例子](https://ext.dcloud.net.cn/plugin?id=69)
- 前端弹出遮罩层挡不住tabbar的问题，跨端处理方式时动态隐藏tabbar。App端可以使用plus.nativeObj.view或subNVue做弹出和遮罩，可参考这个[底部原生图标分享菜单例子](https://ext.dcloud.net.cn/plugin?id=69)
- 微信小程序模拟器1.02.1904090版有bug，在缩放模拟器页面百分比后，tabbar点击多次后就会卡死。真机无碍，使用时注意。[详见](https://developers.weixin.qq.com/community/develop/doc/0002e6e6bf0d602d8c783e10756400)
**代码示例**
......
docs/component/ad.md
浏览文件 @ f51b016b
#### ad
Banner 广告。
广告组件
广告能力在不同小程序端实现不同，使用时需注意用[条件编译](https://uniapp.dcloud.io/platform)调用不同平台的代码。
- App平台：无需编码，在打包App时可直接勾选广告位，[详见](https://dcloud.io/dad.html)
- 微信小程序：[规范文档](https://developers.weixin.qq.com/miniprogram/dev/component/ad.html)
- 百度小程序：[规范文档](https://smartprogram.baidu.com/docs/develop/component/ad/)
- 支付宝小程序：不支持此能力
- 头条小程序：仅小游戏可用，小程序不可用，不适用于uni-app
- QQ小程序：[规范文档](https://q.qq.com/wiki/develop/miniprogram/component/open-ability/ad.html)
- App平台：无需编码，在打包App时可直接勾选广告位，[详见](https://dcloud.io/dad.html)
docs/component/audio.md
浏览文件 @ f51b016b
......@@ -37,7 +37,7 @@ app-nvue也不支持此组件。
|3|解码错误|
|4|不合适资源|
**示例：**
**示例：** [查看示例](https://uniapp.dcloud.io/h5/pages/component/audio/audio)
```html
<template>
......
docs/component/button.md
浏览文件 @ f51b016b
......@@ -15,10 +15,15 @@
|open-type|String||开放能力|||
|hover-class|String|button-hover|指定按钮按下去的样式类。当 hover-class="none" 时，没有点击态效果|||
|hover-start-time|Number|20|按住后多久出现点击态，单位毫秒|||
|hover-stay-time|Number|70|手指松开后点击态保留时间，单位毫秒|||
|@getuserinfo|Handler||用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同uni.getUserInfo|open-type="getUserInfo"|微信小程序|
- **注1：``button-hover`` 默认为 ``{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}``**
|hover-stay-time|Number|70|手指松开后点击态保留时间，单位毫秒|||
|@getphonenumber|Handler||获取用户手机号回调|open-type="getPhoneNumber"|微信小程序|
|@getuserinfo|Handler||用户点击该按钮时，会返回获取到的用户信息，从返回参数的detail中获取到的值同uni.getUserInfo|open-type="getUserInfo"|微信小程序|
|@error|Handler||当使用开放能力时，发生错误的回调|open-type="launchApp"|微信小程序|
|@opensetting|Handler||在打开授权设置页并关闭后回调|open-type="openSetting"|微信小程序|
|@launchapp|Handler||打开 APP 成功的回调|open-type="launchApp"|微信小程序|
- **注1：``button-hover`` 默认为 ``{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}``**
- ```open-type="launchApp"```时需要调起的APP接入微信OpenSDK[详见](https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html)
**size 有效值**
......@@ -46,27 +51,26 @@
|值|说明|平台差异说明|
|:-|:-|:-|
|feedback|打开“意见反馈”页面，用户可提交反馈内容并上传日志|5+App、微信小程序|
|share|触发用户转发|微信小程序、百度小程序、支付宝小程序、头条小程序|
|getUserInfo|获取用户信息，可以从@getuserinfo回调中获取到用户信息，包括手机号、头像、昵称等信息|微信小程序、百度小程序|
| contact | 打开客服会话，如果用户在会话中点击消息卡片后返回应用，可以从 @contact 回调中获得具体信息 |微信小程序|
| getPhoneNumber | 获取用户手机号，可以从@getphonenumber回调中获取到用户信息|微信小程序、百度小程序、头条小程序 |
| launchApp | 打开APP，可以通过app-parameter属性设定向APP传的参数|微信小程序|
| openSetting | 打开授权设置页 |微信小程序、百度小程序|
| getAuthorize | 支持小程序授权 | 支付宝小程序 |
| contactShare | 分享到通讯录好友 | 支付宝小程序 |
| lifestyle | 关注生活号 | 支付宝小程序 |
|feedback|打开“意见反馈”页面，用户可提交反馈内容并上传日志|App、微信小程序、QQ小程序|
|share|触发用户转发|微信小程序、百度小程序、支付宝小程序、头条小程序、QQ小程序|
|getUserInfo|获取用户信息，可以从@getuserinfo回调中获取到用户信息，包括手机号、头像、昵称等信息|微信小程序、百度小程序、QQ小程序|
|contact | 打开客服会话，如果用户在会话中点击消息卡片后返回应用，可以从 @contact 回调中获得具体信息 |微信小程序、百度小程序|
|getPhoneNumber | 获取用户手机号，可以从@getphonenumber回调中获取到用户信息|微信小程序、百度小程序、头条小程序 |
|launchApp | 打开APP，可以通过app-parameter属性设定向APP传的参数|[微信小程序](https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html)、[QQ小程序](https://q.qq.com/wiki/develop/miniprogram/frame/open_ability/open_app.html)|
|openSetting | 打开授权设置页 |微信小程序、百度小程序|
|getAuthorize | 支持小程序授权 | 支付宝小程序 |
|contactShare | 分享到通讯录好友 | 支付宝小程序 |
|lifestyle | 关注生活号 | 支付宝小程序 |
|openGroupProfile|呼起QQ群资料卡页面，可以通过group-id属性设定需要打开的群资料卡的群号，同时manifest中必须配置groupIdList|QQ小程序基础库1.4.7版本+|
**注意**
- 在小程序中，开发者可以登录 [小程序管理后台](https://mp.weixin.qq.com/) 后进入左侧菜单“客服反馈”页面获取反馈内容。
- 在小程序中，开发者可以登录 [微信小程序管理后台](https://mp.weixin.qq.com/) 、[QQ小程序后台](https://q.qq.com/#/)后，进入菜单“客服反馈”页面获取反馈内容。
- 在 App 中，开发者登录 [DCloud开发者中心](https://dev.dcloud.net.cn/) 后点击应用名称，进入左侧菜单“用户反馈”页面获取反馈内容。
- 点击 share 分享按钮时会触发 [onShareAppMessage](/api/plugins/share)
- 支付宝小程序平台，获取用户手机号时，建议先通过条件编译的方式，调用支付宝原生API，[参考](https://docs.alipay.com/mini/api/getphonenumber)
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/button/button)
```html
<template>
......
docs/component/camera.md
浏览文件 @ f51b016b
......@@ -29,7 +29,7 @@
* camera 组件是由客户端创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。可使用 cover-view cover-image 覆盖在上面。
* 请勿在 scroll-view、swiper、picker-view、movable-view 中使用 camera 组件。
* 同一页面只能插入一个 camera 组件。
* 相关API：[reateCameraContext](/api/media/camera-context)
* 相关API：[createCameraContext](/api/media/camera-context)
**代码示例**
......
docs/component/canvas.md
浏览文件 @ f51b016b
......@@ -20,7 +20,7 @@
* canvas 标签默认宽度 300px、高度 225px，动态修改 canvas 大小后需要重新绘制。
* 同一页面中的 canvas-id 不可重复，如果使用一个已经出现过的 canvas-id，该 canvas 标签对应的画布将被隐藏并不再正常工作。
* canvas 在微信小程序、百度小程序、QQ小程序中为原生组件，层级高于前端组件，请勿内嵌在 scroll-view、swiper、picker-view、movable-view 中使用。解决 canvas 层级过高无法覆盖，参考 [native-component](/component/native-component)。
* canvas 在App端 vue 页面不是原生组件，目前App端 nvue 还不支持 canvas 组件。
* canvas 在App端 vue 页面不是原生组件。App-nvue下如需使用canvas，暂未封装为uni API，可参考[文档](https://github.com/dcloudio/NvueCanvasDemo)使用。
**示例：**
......
docs/component/checkbox.md
浏览文件 @ f51b016b
......@@ -19,7 +19,7 @@
|checked|Boolean|false|当前是否选中，可用来设置默认选中|
|color|Color||checkbox的颜色，同css的color|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/checkbox/checkbox)
```html
<template>
......
docs/component/cover-view.md
浏览文件 @ f51b016b
......@@ -52,7 +52,7 @@
- 支付宝小程序中 `cover-view` 不支持嵌套。
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/cover-view/cover-view)
```html
<template>
......
docs/component/form.md
浏览文件 @ f51b016b
......@@ -11,12 +11,12 @@
|@submit|EventHandle|携带 form 中的数据触发 submit 事件，event.detail = {value : {'name': 'value'} , formId: ''}，report-submit 为 true 时才会返回 formId||
|@reset|EventHandle|表单重置时会触发 reset 事件|&nbsp;|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/form/form)
```html
<template>
<view>
<view class="uni-padding-wrap uni-common-mt">
<view>
<form @submit="formSubmit" @reset="formReset">
<view class="uni-form-item uni-column">
<view class="title">switch</view>
......@@ -28,10 +28,10 @@
<view class="title">radio</view>
<radio-group name="radio">
<label>
<radio value="radio1" />选项一
<radio value="radio1" /><text>选项一</text>
</label>
<label>
<radio value="radio2" />选项二
<radio value="radio2" /><text>选项二</text>
</label>
</radio-group>
</view>
......@@ -39,10 +39,10 @@
<view class="title">checkbox</view>
<checkbox-group name="checkbox">
<label>
<checkbox value="checkbox1" />选项一
<checkbox value="checkbox1" /><text>选项一</text>
</label>
<label>
<checkbox value="checkbox2" />选项二
<checkbox value="checkbox2" /><text>选项二</text>
</label>
</checkbox-group>
</view>
......@@ -55,46 +55,44 @@
<input class="uni-input" name="input" placeholder="这是一个输入框" />
</view>
<view class="uni-btn-v">
<button formType="submit">Submit</button>
<button type="default" formType="reset">Reset</button>
<button form-type="submit">Submit</button>
<button type="default" form-type="reset">Reset</button>
</view>
</form>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
formSubmit: function(e) {
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
var formdata = e.detail.value
uni.showModal({
content: '表单数据内容：' + JSON.stringify(formdata),
showCancel: false
});
},
formReset: function(e) {
console.log('清空数据')
}
}
}
</script>
<style>
.uni-form-item .title {
padding: 20rpx 0;
}
</style>
```
```javascript
export default {
data() {
return {
pickerHidden: true,
chosen: ''
}
},
methods: {
pickerConfirm: function(e) {
this.pickerHidden = true
this.chosen = e.target.value
},
pickerCancel: function(e) {
this.pickerHidden = true
},
pickerShow: function(e) {
this.pickerHidden = false
},
formSubmit: function(e) {
console.log('form发生了submit事件，携带数据为：' + JSON.stringify(e.detail.value))
},
formReset: function(e) {
console.log('清空数据')
this.chosen = ''
}
}
}
```
![uniapp](https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/form.png?t=201857)
**tips**
- [插件市场](http://ext.dcloud.net.cn/search?q=%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C)有表单校验插件
\ No newline at end of file
- [插件市场](http://ext.dcloud.net.cn/search?q=%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C)有表单校验插件
docs/component/image.md
浏览文件 @ f51b016b
......@@ -12,10 +12,11 @@
**Tips**
- `<image>` 组件默认宽度 300px、高度 225px；
- `<image>` 组件默认宽度 300px、高度 225px；`app-nvue平台，暂时默认为屏幕宽度`
- `src` 仅支持相对路径、绝对路径，支持 base64 码；
- 页面结构复杂，css样式太多的情况，使用 image 可能导致样式生效较慢，出现 “闪一下” 的情况，此时设置 `image{will-change: transform}` ,可优化此问题。
- 自定义组件里面使用 `<image>`时，若 `src` 使用相对路径可能出现路径查找失败的情况，故建议使用绝对路径。
- webp格式的图片，app-vue下，iOS不支持，Android支持；app-nvue下，iOS和Android均支持。app-vue下也支持gif。
**mode 有效值：**
......@@ -37,7 +38,7 @@ mode 有 13 种模式，其中 4 种是缩放模式，9 种是裁剪模式。
|裁剪|bottom left|不缩放图片，只显示图片的左下边区域|
|裁剪|bottom right|不缩放图片，只显示图片的右下边区域|
**示例：**
**示例：** [查看示例](https://uniapp.dcloud.io/h5/pages/component/image/image)
```html
<template>
......
docs/component/input.md
浏览文件 @ f51b016b
......@@ -67,25 +67,13 @@ App平台的nvue页面，如果是uni-app编译模式，直接使用此属性设
#### App平台iOS端软键盘上方横条去除方案
App平台在iOS上，webview中的软键盘弹出时，默认在软键盘上方有一个横条，显示着：上一项、下一项和完成等按钮。如不想显示这个横条，可以配置softinputNavBar: 'none'
- 如需要整个App配置，则在manifest中配置
```json
"app-plus": {
"softinput": {
"navBar": "none" // 是否显示软键盘上的导航条
}
}
```
- 如需要单个页面配置，则在pages.json中配置
配置方式，在 pages.json 中配置 style
```json
{
"path": "pages/component/input/input",
"style": {
"app-plus":{
"softinputNavBar":"none"
}
}
}
"app-plus": {
"softinputNavBar": "none"
}
```
- 如需使用js动态设置softinputNavBar
......@@ -131,7 +119,7 @@ App端开发聊天类应用时，目前推荐改为adjustResize模式。在hello
- 原生输入框在iOS上不会有软键盘上方的横条
- 原生输入框一样受配置的`adjustPan|adjustResize`模式影响
**input示例**
**input示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/input/input)
```html
<template>
......
docs/component/label.md
浏览文件 @ f51b016b
......@@ -15,7 +15,7 @@ for优先级高于内部控件，内部有多个控件的时候默认触发第
**注：**
- app-nvue平台 暂不支持for属性
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/label/label)
```html
<template>
......
docs/component/list.md
浏览文件 @ f51b016b
......@@ -27,6 +27,7 @@ app端nvue专用组件。在app-nvue下，如果是长列表，使用list组件
> **注意**
> - 不允许相同方向的 `<list>` 或者 `<scroll-view>` 互相嵌套，换句话说就是嵌套的 `<list>` / `<scroll-view>` 必须是不同的方向。
> - `<list>` 需要显式的设置其宽高，可使用 position: absolute; 定位或 width、height 设置其宽高值。
> - list是区域滚动，不会触发页面滚动，无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。
#### 子组件
`<list>` 的子组件只能包括以下四种组件或是 fix 定位的组件，其他形式的组件将不能被正确渲染。
......
docs/component/live-pusher.md
浏览文件 @ f51b016b
#### live-pusher
#### live-pusher
实时音视频录制，也称直播推流。
**平台差异说明**
实时音视频录制，也称直播推流。
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√(仅nvue)|x|√|x|x|x|x|
目前只有App和微信小程序支持。
如app平台的vue页面需要支持直播推流，需编写条件编译代码，使用 `plus.video.LivePusher`，[业务指南](https://ask.dcloud.net.cn/article/13416)、[规范文档](http://www.html5plus.org/doc/zh_cn/video.html#plus.video.LivePusher)
- 微信小程序：[规范文档](https://developers.weixin.qq.com/miniprogram/dev/component/live-pusher.html)
- App平台：nvue文件下也支持live-pusher组件，API与微信相同。如果是vue文件，则需要单独编写条件编译代码，使用plus.video.LivePusher，[业务指南](https://ask.dcloud.net.cn/article/13416)、[规范文档](http://www.html5plus.org/doc/zh_cn/video.html#plus.video.LivePusher)
使用nvue做直播，比使用vue的优势有：
1. nvue可一套代码直接编译到App和微信
2. nvue的cover-view比vue的cover-view更强大，在视频上绘制元素更容易。如果只考虑App端的话，不用cover-view，任意组件都可以覆盖live-pusher组件，因为nvue没有层级问题。
3. 若需要视频内嵌在swiper里上下滑动（类抖音、映客首页模式），App端只有nvue才能实现
当然nvue相比vue的坏处是css写法受限，如果只开发微信小程序，不考虑App，那么使用vue页面也是一样的。
**参数说明**
设置live-pusher组件的推流地址，推流视频模式等。
属性|类型 |默认值|必填|说明 :--|:--|:--|:--|:--|
url|string| |是|推流地址，支持RTMP协议。
mode |string| |否|推流视频模式，可取值：SD（标清）, HD（高清）, FHD（超清）。
muted|Boolean|false|否|是否静音。
enable-camera|Boolean|true|否|开启摄像头。
auto-focus|Boolean|true|否|自动聚集。
beauty|Number|0|否|美颜，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
whiteness|Number|0|否|美白，取值范围 0-9（iOS取值范围为1） ，0 表示关闭。
```html
<template>
<view>
<live-pusher id='livePusher1' class="livePusher" ref="livePusher" url=""
mode="SD" :muted="true" :enable-camera="true" :auto-focus="true" :beauty="1" whiteness="2"
aspect="9:16" postition="absolute"
@statechange="statechange" @netstatus="netstatus" @error = "error"
></live-pusher>
<button class="btn" @click="start">开始推流</button>
<button class="btn" @click="pause">暂停推流</button>
<button class="btn" @click="resume">resume</button>
<button class="btn" @click="stop">停止推流</button>
<button class="btn" @click="snapshot">快照</button>
<button class="btn" @click="startPreview">开启摄像头预览</button>
<button class="btn" @click="stopPreview">关闭摄像头预览</button>
<button class="btn" @click="switchCamera">切换摄像头</button>
</view>
</template>
```
```javascript
<script>
export default {
onReady() {
this.context = uni.createLivePusherContext("livePusher1", this);
},
methods: {
statechange(e) {
console.log("statechange:" + JSON.stringify(e));
},
netstatus(e) {
console.log("netstatus:" + JSON.stringify(e));
},
error(e) {
console.log("error:" + JSON.stringify(e));
},
start: function() {
this.context.start((a) => {
console.log("livePusher.start:" + JSON.stringify(a));
});
},
close: function() {
this.context.close((a) => {
console.log("livePusher.close:" + JSON.stringify(a));
});
},
snapshot: function() {
this.context.snapshot((e) => {
console.log(JSON.stringify(e));
});
},
resume: function() {
this.context.resume((a) => {
console.log("livePusher.resume:" + JSON.stringify(a));
});
},
pause: function() {
this.context.pause((a) => {
console.log("livePusher.pause:" + JSON.stringify(a));
});
},
stop: function() {
this.context.stop((a) => {
console.log(JSON.stringify(a));
});
},
switchCamera: function() {
this.context.switchCamera((a) => {
console.log("livePusher.switchCamera:" + JSON.stringify(a));
});
},
startPreview: function() {
this.context.startPreview((a) => {
console.log("livePusher.startPreview:" + JSON.stringify(a));
});
},
stopPreview: function() {
this.context.stopPreview((a) => {
console.log("livePusher.stopPreview:" + JSON.stringify(a));
});
}
}
}
</script>
```
相关api：[uni.createLivePusherContext](/api/media/live-pusher-context?id=createLivePusherContext)
**注意**
* live-pusher 是原生组件，在小程序端层级高于前端组件，请勿在 scroll-view、swiper、picker-view、movable-view 中使用，需使用cover-view覆盖。在App端的nvue文件中，live-pusher没有这类限制。
* live-pusher 是原生组件，在小程序端层级高于前端组件，需使用cover-view覆盖。在低版本微信中，live-pusher无法内嵌于 scroll-view、swiper、picker-view、movable-view 中。在App端的nvue文件中，live-pusher没有这类限制。
* App平台：使用 `<live-pusher/>` 组件，打包 App 时必须勾选 manifest.json->App 模块权限配置->LivePusher(直播推流) 模块。
......
docs/component/map.md
浏览文件 @ f51b016b
......@@ -21,7 +21,7 @@
|controls|Array||控件||
|include-points|Array||缩放视野以包含所有给定的坐标点|App-nvue 2.1.5+、微信小程序、H5、百度小程序、支付宝小程序|
|show-location|Boolean||显示带有方向的当前定位点|微信小程序、H5、百度小程序、支付宝小程序|
|@markertap|EventHandle||点击标记点时触发|App平台需要指定 marker 对象属性 id|
|@markertap|EventHandle||点击标记点时触发|App-nvue暂不支持, App平台需要指定 marker 对象属性 id|
|@callouttap|EventHandle||点击标记点对应的气泡时触发||
|@controltap|EventHandle||点击控件时触发||
|@regionchange|EventHandle||视野发生变化时触发|微信小程序、H5、百度小程序、支付宝小程序|
......@@ -62,7 +62,7 @@
|borderRadius|callout边框圆角|Number|App-nvue 2.1.5+、微信小程序、H5、百度小程序|
|bgColor|背景色|String|App-nvue 2.1.5+、微信小程序、H5、百度小程序|
|padding|文本边缘留白|Number|App-nvue 2.1.5+、微信小程序、H5、百度小程序|
|display|'BYCLICK':点击显示; 'ALWAYS':常显|String|微信小程序、H5、百度小程序|
|display|'BYCLICK':点击显示; 'ALWAYS':常显|String|App-nvue 2.1.5+、微信小程序、H5、百度小程序|
|textAlign|文本对齐方式。有效值: left, right, center|String|App-nvue 2.1.5+、微信小程序、百度小程序|
**marker 上的标签 label**
......@@ -131,7 +131,7 @@
地图组件的经纬度必填，如果不填经纬度则默认值是北京的经纬度。
**示例**
**示例** [查看示例](https://uniapp.dcloud.io/h5/pages/component/map/map)
```html
<template>
......@@ -174,16 +174,16 @@ map 组件相关操作的 JS API：[uni.createMapContext](api/location/map?id=cr
**注意事项**
- 小程序和 App的vue文件 中，`<map>` 组件是由引擎创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。在`<map>`上绘制内容，可使用组件自带的marker、controls等属性，也可以使用`<cover-view>`组件。App端还可以使用plus.nativeObj.view 或 subNVue 绘制原生内容，[参考](/component/native-component)。另外App端nvue文件不存在层级问题。
- App端nvue文件的map和小程序拉齐度更高。vue里的map则与plus.map功能一致，和小程序的地图略有差异。
- 小程序和 App 中，请勿在 scroll-view、swiper、picker-view、movable-view 中使用 `<map>` 组件。
- 小程序和 App 中，css 动画对 `<map>` 组件无效。
- 小程序和app-vue中，`<map>` 组件是由引擎创建的原生组件，它的层级是最高的，不能通过 z-index 控制层级。在`<map>`上绘制内容，可使用组件自带的marker、controls等属性，也可以使用`<cover-view>`组件。App端还可以使用plus.nativeObj.view 或 subNVue 绘制原生内容，[参考](/component/native-component)。另外App端nvue文件不存在层级问题。从微信基础库2.8.3开始，支持map组件的同层渲染，不再有层级问题。
- App端nvue文件的map和小程序拉齐度更高。vue里的map则与plus.map功能一致，和小程序的地图略有差异。App端使用map推荐用nvue。
- 在涉及层级问题的小程序中和app-vue中，请勿在 scroll-view、swiper、picker-view、movable-view 中使用 `<map>` 组件。
- 小程序和 app-vue 中，css 动画对 `<map>` 组件无效。
- map 组件使用的经纬度是国测局坐标，调用 uni.getLocation 接口需要指定 type 为 gcj02。
- `<map>` 组件在不同平台的底层引擎是不同的：H5、微信小程序为腾讯地图；App、支付宝小程序为高德地图；百度小程序端为百度地图。App端vue页面也可以使用百度地图，在manifest中配置，但nvue页面只支持高德地图。
- map 组件默认的api是参考微信小程序的，如果觉得不够用，可以用plus.map，可以通过`$getAppMap`获取原生地图对象，[详见](https://uniapp.dcloud.io/api/location/map)
- `<map>` 组件在不同平台的底层引擎是不同的：H5、微信小程序为腾讯地图；App、支付宝小程序为高德地图；百度小程序端为百度地图。app-vue也可以使用百度地图，在manifest中配置，但app-nvue只支持高德地图。
- map 组件默认的api是参考微信小程序的，如需要使用plus.map，可以通过`$getAppMap`获取原生地图对象，[详见](https://uniapp.dcloud.io/api/location/map)
- H5 端获取定位信息，需要部署在 **https** 服务上，本地预览（localhost）仍然可以使用 http 协议。
- 无 GPS 模块的 PC 设备使用 Chrome 浏览器的时候，位置信息是连接谷歌服务器获取的，国内用户可能获取位置信息失败。
- App 端使用地图组件需要向高德或百度等三方服务商申请SDK资质，获取AppKey，打包时需要在manifest文件中勾选相应模块，在SDK配置中填写Appkey。在manifest可视化界面有详细申请指南。
- App 端使用地图组件需要向高德或百度等三方服务商申请SDK资质，获取AppKey，打包时需要在manifest文件中勾选相应模块，在SDK配置中填写Appkey。注意申请包名和打包时的包名需匹配一致。在manifest可视化界面有详细申请指南。
##### FAQ
......
docs/component/movable-view.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
......@@ -15,7 +15,8 @@
|scale-area|Boolean|false|当里面的 movable-view 设置为支持双指缩放时，设置此值可将缩放手势生效区域修改为整个 movable-area|
**注意：movable-area 必须设置 width 和 height 属性，不设置默认为 10px**
- movable-area app-nvue平台 暂不支持手势缩放
- movable-area app-nvue平台 暂不支持手势缩放，并且和滚动冲突。
- PC平台不支持 movable-area。
#### movable-view
......@@ -23,7 +24,7 @@
**平台差异说明**
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|√|√|x|√|
......@@ -32,7 +33,7 @@
|属性名|类型|默认值|说明|平台差异说明|
|:-|:-|:-|:-|:-|
|direction|String|none|movable-view的移动方向，属性值有all、vertical、horizontal、none||
|inertia|Boolean|false|movable-view是否带有惯性|微信小程序、5+App、H5、百度小程序|
|inertia|Boolean|false|movable-view是否带有惯性|微信小程序、App、H5、百度小程序|
|out-of-bounds|Boolean|false|超过可移动区域后，movable-view是否还可以移动|微信小程序、5+App、H5、百度小程序|
|x|Number / String||定义x轴方向的偏移，如果x的值不在可移动范围内，会自动移动到可移动范围；改变x的值会触发动画||
|y|Number / String||定义y轴方向的偏移，如果y的值不在可移动范围内，会自动移动到可移动范围；改变y的值会触发动画||
......@@ -63,9 +64,9 @@
**Tips**
- movable-view必须在`<movable-area/>`组件中，并且必须是直接子节点，否则不能移动。
- 如果遇到x、y、scale属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98)
- swiper在非H5端，不支持内嵌video、map等原生组件。更新：微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用
- 除了H5端和app-nvue端，其他平台不支持内嵌video、map等原生组件。更新：微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用
**示例**
**示例**
```html
<template>
<view class="page-body">
......
docs/component/native-component.md
浏览文件 @ f51b016b
......@@ -14,7 +14,7 @@ H5、App的nvue页面，不存在混合渲染的情况，它们或者全部是
* [input](/component/input)（仅在微信小程序、百度小程序、支付宝小程序、头条小程序中且input置焦时表现为原生组件）
* [textarea](/component/textarea)（仅在微信小程序、百度小程序、头条小程序表现为原生组件）
* [live-player](/component/live-player)（仅微信小程序、百度小程序支持，App端直接使用video组件可同时实现拉流）
* [live-pusher](/component/live-pusher)（仅微信小程序、百度小程序支持，App端直接使用plus.video.LivePusher可实现推流）
* [live-pusher](/component/live-pusher)（仅微信小程序、百度小程序、app-nvue支持，app-vue使用plus.video.LivePusher可实现推流）
* [cover-view](/component/cover-view)
* [cover-image](/component/cover-view?id=cover-image)
......@@ -24,7 +24,8 @@ H5、App的nvue页面，不存在混合渲染的情况，它们或者全部是
由于原生组件脱离在 WebView 渲染流程外，因此在使用时有以下限制：
* 原生组件的层级是**最高**的，所以页面中的其他组件无论设置 z-index 为多少，都无法盖在原生组件上。后插入的原生组件可以覆盖之前的原生组件。
* 原生组件无法在 scroll-view、swiper、picker-view、movable-view 中使用（微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用，即原生组件的同层渲染；App-nvue 2.1.5也实现了同层渲染了）
* 原生组件无法在 scroll-view、swiper、picker-view、movable-view 中使用。
* 同层渲染支持：微信基础库2.4.4起支持了video的同层渲染、微信基础库2.8.3支持map的同层渲染。支持同层渲染后，相关组件的时候不再有层级问题，无需再使用cover-view覆盖，也可以内嵌入swiper等组件。app-nvue 不涉及层级问题，天然所有组件都是同层渲染。
* 部分CSS样式无法应用于原生组件，例如：
* 无法对原生组件设置 CSS 动画；
* 无法定义原生组件为 position: fixed；
......
docs/component/navigator.md
浏览文件 @ f51b016b
......@@ -28,9 +28,9 @@
**注意**
- navigator-hover 默认为 {background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;}, ``<navigator>`` 的子节点背景色应为透明色。**
- app-nvue 平台暂不支持 `<navigator>`
- app-nvue 平台只有纯nvue项目（render为native）才支持 `<navigator>`。非render为native的情况下，nvue暂不支持navigator组件，请使用API跳转。
**示例**
**示例** [查看示例](https://uniapp.dcloud.io/h5/pages/component/navigator/navigator)
```html
<template>
......@@ -40,9 +40,12 @@
<navigator url="navigate/navigate?title=navigate" hover-class="navigator-hover">
<button type="default">跳转到新页面</button>
</navigator>
<navigator url="redirect/redirect?title=redirect" redirect hover-class="other-navigator-hover">
<navigator url="redirect/redirect?title=redirect" open-type="redirect" hover-class="other-navigator-hover">
<button type="default">在当前页打开</button>
</navigator>
<navigator url="/pages/tabBar/extUI/extUI" open-type="switchTab" hover-class="other-navigator-hover">
<button type="default">跳转tab页面</button>
</navigator>
</view>
</view>
</view>
......
docs/component/picker-view.md
浏览文件 @ f51b016b
......@@ -19,7 +19,7 @@
`<picker-view />` 的子组件，仅可放置于 `<picker-view />` 中，其子节点的高度会自动设置成与 picker-view 的选中框的高度一致
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/picker-view/picker-view)
```html
<template>
......
docs/component/picker.md
浏览文件 @ f51b016b
......@@ -118,7 +118,7 @@
|@cancel|EventHandle||取消选择时触发|
|disabled|Boolean|false|是否禁用|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/picker/picker)
```html
<template>
......
docs/component/progress.md
浏览文件 @ f51b016b
......@@ -14,7 +14,7 @@
|active-mode |String |backwards |backwards: 动画从头播；forwards：动画从上次结束点接着播|微信小程序、5+APP、H5 |
|@activeend |EventHandle| |动画完成事件 |微信小程序 |
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/progress/progress)
```html
<template>
<view>
......
docs/component/radio.md
浏览文件 @ f51b016b
......@@ -21,7 +21,7 @@
|disabled|Boolean|false|是否禁用|
|color|Color||radio的颜色，同css的color|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/radio/radio)
```html
<template>
......
docs/component/recycle-list.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@ app端nvue专用组件。
`<recycle-list>` 是一个新的列表容器，具有回收和复用的能力，可以大幅优化内存占用和渲染性能。它的性能比list组件更高，但写法受限制。它除了会释放不可见区域的渲染资源，在非渲染的数据结构上也有更多优化。
此组件自HBuilderX 2.1.5+起支持。
此组件自HBuilderX 2.2.6+起支持。
#### 子组件
`<recycle-list>` 只能使用 `<cell-slot>` 作为其直接子节点，使用其他节点无效。
......@@ -12,6 +12,10 @@ app端nvue专用组件。
#### <cell-slot>
<cell-slot> 代表的是列表每一项的模板，它只用来描述模板的结构，并不对应实际的节点。`<cell-slot>` 的个数只表示模板的种类数，真实列表项的个数是由数据决定的。
**注意**
- `<cell-slot>` 包含自定义组件时，在 Android 上有性能问题
- recycle-list 是区域滚动，不会触发页面滚动，无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。
属性|说明
:--|:--|
......
docs/component/rich-text.md
浏览文件 @ f51b016b
......@@ -87,7 +87,7 @@
|tr||
|ul|&nbsp;|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/rich-text/rich-text)
```html
<template>
<view class="content">
......
docs/component/scroll-view.md
浏览文件 @ f51b016b
......@@ -22,7 +22,7 @@
使用竖向滚动时，需要给 ``<scroll-view>`` 一个固定高度，通过 css 设置 height。
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/scroll-view/scroll-view)
```html
<template>
<view>
......@@ -97,10 +97,10 @@ export default {
**Tips**
- 5+APP和小程序中，请勿在 scroll-view 中使用 map、video 等原生组件。小程序中 scroll-view 中也不要使用 canvas、textarea 原生组件。更新：微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用
- scroll-view 不适合放长列表，有性能问题。长列表滚动和下拉刷新，应该使用原生导航栏搭配页面级的滚动和下拉刷新实现。
- APP-vue和小程序中，请勿在 scroll-view 中使用 map、video 等原生组件。小程序中 scroll-view 中也不要使用 canvas、textarea 原生组件。更新：微信基础库2.4.4起支持了原生组件在 scroll-view、swiper、movable-view 中的使用。app-nvue无此限制。
- scroll-view 不适合放长列表，有性能问题。长列表滚动和下拉刷新，应该使用原生导航栏搭配页面级的滚动和下拉刷新实现。包括在app-nvue页面，长列表应该使用list而不是scroll-view
- scroll-into-view 的优先级高于 scroll-top。
- 使用 scroll-view 会和原生下拉刷新造成冲突，所以在使用 scroll-view 的地方不建议使用下拉刷新，也不建议监听 onPullDownRefresh 事件。
- 若要使用下拉刷新，请使用页面的滚动，而不是 scroll-view 。插件市场有前端模拟的下拉刷新，但性能不佳。
- scroll-view是区域滚动，不会触发页面滚动，无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。
- 若要使用下拉刷新，建议使用页面的滚动，而不是 scroll-view 。插件市场有前端模拟的下拉刷新，但性能不佳。
- 如果遇到scroll-top、scroll-left属性设置不生效的问题参考：[组件属性设置不生效解决办法](/use?id=%E5%B8%B8%E8%A7%81%E9%97%AE%E9%A2%98)
- scroll-view的滚动条设置，可通过css的-webkit-scrollbar自定义，包括隐藏滚动条。（nvue无此css）
\ No newline at end of file
- scroll-view的滚动条设置，可通过css的-webkit-scrollbar自定义，包括隐藏滚动条。（nvue无此css）
docs/component/slider.md
浏览文件 @ f51b016b
......@@ -26,7 +26,7 @@
- activeColor默认值在不同平台不一样，微信是绿色(#1aad19)，头条是红色，其他平台是蓝色
- 如需要区间滑块，即一根横条上使用2个滑块选择一段范围，可见[插件市场](https://ext.dcloud.net.cn/search?q=%E5%8C%BA%E9%97%B4%E6%BB%91%E5%9D%97)
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/slider/slider)
```html
<template>
......
docs/component/swiper.md
浏览文件 @ f51b016b
......@@ -8,19 +8,19 @@
|:-|:-|:-|:-|:-|
|indicator-dots|Boolean|false|是否显示面板指示点||
|indicator-color|Color|rgba(0, 0, 0, .3)|指示点颜色||
|indicator-active-color|Color|#000000|当前选中的指示点颜色||
|active-class|String||swiper-item 可见时的 class|支付宝小程序|
|indicator-active-color|Color|#000000|当前选中的指示点颜色||
|active-class|String||swiper-item 可见时的 class|支付宝小程序|
|changing-class|String||acceleration 设置为 {{true}} 时且处于滑动过程中，中间若干屏处于可见时的class|支付宝小程序|
|autoplay|Boolean|false|是否自动切换||
|current|Number|0|当前所在滑块的 index||
|current-item-id|String||当前所在滑块的 item-id ，不能与 current 被同时指定|支付宝小程序不支持|
|interval|Number|5000|自动切换时间间隔||
|duration|Number|500|滑动动画时长||
|duration|Number|500|滑动动画时长|app-nvue不支持|
|circular|Boolean|false|是否采用衔接滑动||
|vertical|Boolean|false|滑动方向是否为纵向||
|previous-margin|String|0px|前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值|头条小程序不支持|
|next-margin|String|0px|后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值|头条小程序不支持|
|acceleration|Boolean|false|当开启时，会根据滑动速度，连续滑动多屏|支付宝小程序|
|previous-margin|String|0px|前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值|app-nvue、头条小程序不支持|
|next-margin|String|0px|后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值|app-nvue、头条小程序不支持|
|acceleration|Boolean|false|当开启时，会根据滑动速度，连续滑动多屏|支付宝小程序|
|disable-programmatic-animation|Boolean|false|是否禁用代码变动触发 swiper 切换时使用动画。|支付宝小程序|
|display-multiple-items|Number|1|同时显示的滑块数量|支付宝小程序不支持|
|skip-hidden-item-layout|Boolean|false|是否跳过未显示的滑块布局，设为 true 可优化复杂情况下的滑动性能，但会丢失隐藏状态滑块的布局信息|5+App、微信小程序|
......@@ -29,7 +29,7 @@
|easing-function|String|default|指定 swiper 切换缓动动画类型，有效值：default、linear、easeInCubic、easeOutCubic、easeInOutCubic|微信小程序|
|@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小程序|
|@animationfinish|EventHandle||动画结束时会触发 animationfinish 事件，event.detail = {current: current, source: source}|头条小程序不支持|
|@animationfinish|EventHandle||动画结束时会触发 animationfinish 事件，event.detail = {current: current, source: source}|头条小程序不支持|
change 事件返回 detail 中包含一个 source 字段，表示导致变更的原因，可能值如下：
......@@ -48,7 +48,8 @@ change 事件返回 detail 中包含一个 source 字段，表示导致变更的
- 注意：其中只可放置 ``<swiper-item>`` 组件，否则会导致未定义的行为。
- 如果遇到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)搜索
- 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...
#### swiper-item
仅可放置在 ``<swiper>`` 组件中，宽高自动设置为100%。
......@@ -57,7 +58,7 @@ change 事件返回 detail 中包含一个 source 字段，表示导致变更的
|:-|:-|:-|:-|:-|
|item-id|String||该 swiper-item 的标识符|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/swiper/swiper)
```html
<template>
<view>
......
docs/component/switch.md
浏览文件 @ f51b016b
......@@ -12,7 +12,7 @@
|@change|EventHandle||checked 改变时触发 change 事件，event.detail={ value:checked}||
|color|Color||switch 的颜色，同 css 的 color|&nbsp;|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/switch/switch)
```html
<template>
......
docs/component/text.md
浏览文件 @ f51b016b
......@@ -26,7 +26,7 @@
- 支持 `\n` 方式换行。
- 如果使用 `<span>` 组件编译时会被转换为 `<text>`。
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/text/text)
```html
<template>
<view>
......
docs/component/textarea.md
浏览文件 @ f51b016b
......@@ -27,7 +27,7 @@
|@input|EventHandle||当键盘输入时，触发 input 事件，event.detail = {value, cursor}， @input 处理函数的返回值并不会反映到 textarea 上||
|@confirm|EventHandle||点击完成时， 触发 confirm 事件，event.detail = {value: value}|微信小程序、百度小程序、QQ小程序|
**示例**
**示例** [查看示例](https://uniapp.dcloud.io/h5/pages/component/textarea/textarea)
```html
<template>
......
docs/component/video.md
浏览文件 @ f51b016b
......@@ -40,7 +40,7 @@
`<video>` 默认宽度 300px、高度 225px，可通过 css 设置宽高。
**示例**
**示例** [查看示例](https://uniapp.dcloud.io/h5/pages/component/video/video)
```html
<template>
......
docs/component/view.md
浏览文件 @ f51b016b
......@@ -11,7 +11,7 @@
|hover-start-time|Number|50|按住后多久出现点击态，单位毫秒|
|hover-stay-time|Number|400|手指松开后点击态保留时间，单位毫秒|
**示例**
**示例** [查看演示](https://uniapp.dcloud.io/h5/pages/component/view/view)
```html
<template>
......
docs/component/waterfall.md
浏览文件 @ f51b016b
......@@ -4,7 +4,7 @@ app端nvue专用组件。
`<waterfall>` 组件是提供瀑布流布局的核心组件。瀑布流，又称瀑布流式布局是比较流行的一种页面布局，视觉表现为参差不齐的多栏布局。随着页面滚动条向下滚动，这种布局还可以不断加载数据块并附加至当前尾部。
使用普通view做瀑布流，无法实现重用和不可见渲染资源释放。使用<waterfall>组件，指定cell后，原生引擎会自动优化性能。
在nvue中，使用普通view做瀑布流，无法实现重用和不可见渲染资源释放。使用<waterfall>组件，指定cell后，原生引擎会自动优化性能。
```
<template>
......@@ -60,3 +60,6 @@ app端nvue专用组件。
- longpress：用于监听长按事件（一般绑定于子组件之上例如：长按可删除）。
- appear：用于监听子组件出现事件（一般绑定于子组件之上例如：监听最后一个元素出现，加载新的数据）
- disappear：用于监听子组件滑出屏幕事件（一般绑定于子组件之上）
**注意**
- waterfall是区域滚动，不会触发页面滚动，无法触发pages.json配置的下拉刷新、页面触底onReachBottomDistance、titleNView的transparent透明渐变。
docs/component/web-view.md
浏览文件 @ f51b016b
......@@ -86,7 +86,7 @@
</code>
</pre>
**示例**
**示例** [查看示例](https://uniapp.dcloud.io/h5/pages/component/web-view/web-view)
```html
<template>
<view>
......@@ -217,6 +217,19 @@ export default {
</script>
```
如果想设置web-view组件可双指缩放，可参考如下代码：
```js
onReady() {
// #ifdef APP-PLUS
var currentWebview = this.$mp.page.$getAppWebview() //获取当前页面的webview对象
setTimeout(function() {
wv = currentWebview.children()[0]
wv.setStyle({scalable:true})
}, 1000); //如果是页面初始化调用时，需要延时一下
// #endif
}
};
```
##### `web-view`组件的层级问题解决
web-view组件在App和小程序中层级较高，如需要在vue页面中写代码为web-view组件覆盖内容，小程序端无解，只能由web-view的组件自己弹出div。App端有如下若干方案：
......@@ -225,6 +238,13 @@ web-view组件在App和小程序中层级较高，如需要在vue页面中写代
3. 也可以使用HBuilderX1.9.10以后新出的[原生子窗体subNvue](/api/window/subNVues)
4. 也可以在web-view组件内嵌的网页中弹出z-index更高的div。如果是外部网页，可以在vue中获得子webview对象后，通过[evalJS](https://www.html5plus.org/doc/zh_cn/webview.html#plus.webview.WebviewObject.evalJS)为这个子webview注入一段js，操作其弹出div层。
##### web-view组件的浏览器内核说明
- H5端的web-view其实是被转为iframe运行，使用的是当前的浏览器
- 小程序的web-view使用的是小程序自带的浏览器内核，不同厂商不一样，[详见](https://ask.dcloud.net.cn/article/1318)
- App端，Android，使用的是os自带的浏览器内核，在设置-所有应用里，显示系统服务，可查看Android System Webview的版本。在Android5+，系统webview支持安装升级。
- App端，iOS，是分为UIWebview和WKWebview的，2.2.5+起默认为WKWebview，之前版本[详见](https://ask.dcloud.net.cn/article/36348)
**注意事项**
- `<web-view>` 组件默认铺满全屏并且层级高于前端组件。App端想调节大小或再其上覆盖内容需使用plus规范。
- `<web-view>` 组件所在窗口的标题，跟随页面的 `<title>` 值的变化而变化。
......
docs/frame.md
浏览文件 @ f51b016b
......@@ -340,7 +340,9 @@ page {
### 全局样式与局部样式
定义在 App.vue 中的样式为全局样式，作用于每一个页面。在 pages 目录下 的 vue 文件中定义的样式为局部样式，只作用在对应的页面，并会覆盖 App.vue 中相同的选择器。
**注意：** App.vue 中通过 ``@import`` 语句可以导入外联样式，一样作用于每一个页面。
**注意：**
- App.vue 中通过 ``@import`` 语句可以导入外联样式，一样作用于每一个页面。
- nvue页面暂不支持全局样式
### CSS变量
......@@ -428,6 +430,8 @@ uni-app 提供内置 CSS 变量
|NavigationBar|导航栏|44px|44px|
|TabBar|底部选项卡|56px|50px|
各小程序平台，包括同小程序平台的iOS和Android的高度也不一样。TabBar在App端默认高度，与微信iOS版主界面的tabbar高度保持一致。
### Flex布局
为支持跨平台，框架建议使用Flex布局，关于Flex布局可以参考外部文档[A Complete Guide to Flexbox](https://css-tricks.com/snippets/css/a-guide-to-flexbox/)、[阮一峰的flex教程](http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html)等。
......@@ -441,13 +445,17 @@ uni-app 提供内置 CSS 变量
- 使用本地路径背景图片需注意：
1. 图片小于 40kb，``uni-app`` 会自动将其转化为 base64 格式；
2. 图片大于等于 40kb， 需开发者自己将其转换为base64格式使用，或将其挪到服务器上，从网络地址引用。
3. 本地背景图片的引用路径仅支持以 ~@ 开头的绝对路径（不支持相对路径）。
3. 本地背景图片的引用路径推荐使用以 ~@ 开头的绝对路径。
```css
.test2 {
background-image: url('~@/static/logo.png');
}
```
**注意**
- 微信小程序不支持相对路径（真机不支持，开发工具支持）
- 其他端使用本地背景图片作为背景图没有限制
### 字体图标
``uni-app`` 支持使用字体图标，使用方式与普通 ``web`` 项目相同，需要注意以下几点：
......@@ -459,7 +467,7 @@ uni-app 提供内置 CSS 变量
- ``uni-app`` 本地路径图标字体支持情况：
1. 字体文件小于 40kb，``uni-app`` 会自动将其转化为 base64 格式；
2. 字体文件大于等于 40kb， 需开发者自己转换，否则使用将不生效；
3. 字体文件的引用路径仅支持以 ~@ 开头的绝对路径（不支持相对路径）。
3. 字体文件的引用路径推荐使用以 ~@ 开头的绝对路径。
```css
@font-face {
font-family: test1-icon;
......@@ -617,6 +625,8 @@ uni-app支持使用**npm**安装第三方包。
npm init -y
```
cli项目默认已经有package.json了。HBuilderX创建的项目默认没有，需要通过初始化命令来创建。
**安装依赖**
在项目根目录执行命令安装npm包：
......@@ -636,7 +646,7 @@ const package = require('packageName')
* 为多端兼容考虑，建议优先从 [uni-app插件市场](https://ext.dcloud.net.cn/) 获取插件。直接从 npm 下载库很容易只兼容H5端。
* 非 H5 端不支持使用含有 dom、window 等操作的 vue 组件和 js 模块，安装的模块及其依赖的模块使用的 API 必须是 uni-app 已有的 [API](./api/README)（兼容小程序 API），比如：支持[高德地图微信小程序 SDK](https://www.npmjs.com/package/amap-wx)。类似[jQuery](https://www.npmjs.com/package/jquery) 等库只能用于H5端。
* node_modules 目录必须在项目根目录下。
* node_modules 目录必须在项目根目录下。不管是cli项目还是HBuilderX创建的项目。
* 支持安装 mpvue 组件，但npm方式不支持小程序自定义组件（如 wxml格式的vant-weapp），使用小程序自定义组件请参考：[小程序组件支持](./frame?id=%E5%B0%8F%E7%A8%8B%E5%BA%8F%E7%BB%84%E4%BB%B6%E6%94%AF%E6%8C%81)。
* 关于ui库的获取，详见[多端UI库](https://ask.dcloud.net.cn/article/35489)
......@@ -710,14 +720,14 @@ const package = require('packageName')
```
## 小程序组件支持
``uni-app`` 支持在 5+App 和小程序中使用**小程序组件**。
``uni-app`` 支持在 App 和小程序中使用**小程序自定义组件**。
**平台差异说明**
|平台|支持情况|小程序组件存放目录|
|---|---|---|
|H5|不支持||
|5+App|支持微信小程序组件|wxcomponents|
|App（不含nvue）|支持微信小程序组件|wxcomponents|
|微信小程序|支持微信小程序组件|wxcomponents|
|支付宝小程序|支持支付宝小程序组件|mycomponents|
|百度小程序|支持百度小程序组件|swancomponents|
......@@ -922,9 +932,8 @@ slide-view.vue
**注意事项**
* 小程序组件需要放在项目特殊文件夹 ``wxcomponents``（或 mycomponents、swancomponents）。
* HBuilderX 建立的工程 ``wxcomponents`` 文件夹在 项目根目录下。
* vue-cli 建立的工程 ``wxcomponents`` 文件夹在 ``src`` 目录下。
* 小程序组件需要放在项目特殊文件夹 ``wxcomponents``（或 mycomponents、swancomponents）。HBuilderX 建立的工程 ``wxcomponents`` 文件夹在 项目根目录下。vue-cli 建立的工程 ``wxcomponents`` 文件夹在 ``src`` 目录下。可以在 vue.config.js 中自定义其他目录。
* 当需要在 vue 组件中使用小程序组件时，注意在 pages.json 的 globalStyle 中配置 usingComponents，而不是页面级配置。
* 注意数据和事件绑定的差异，使用时应按照 vue 的数据和事件绑定方式
- 属性绑定从 attr="{{ a }}"，改为 :attr="a"；从 title="复选框{{ item }}" 改为 :title="'复选框' + item"
- 事件绑定从 bind:click="toggleActionSheet1" 改为 @click="toggleActionSheet1"
......@@ -938,13 +947,22 @@ slide-view.vue
## WXS
WXS是微信小程序的一套脚本语言，[规范详见](https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxs/)。
uni-app可以将wxs代码编译到微信小程序、QQ小程序、5+APP上（`HBuilderX 2.2.4-alpha`及以上版本）
它的特点是运行在渲染层。当需要避免逻辑层和渲染层交互通信折损时，可采用wxs。
uni-app可以将wxs代码编译到微信小程序、QQ小程序、APP、H5上（`HBuilderX 2.2.5-alpha`及以上版本）
与wxs类似，百度小程序提供了Filter、阿里小程序提供了SJS，uni-app也支持使用这些功能，并将它们编译到百度和阿里的小程序端。不过它们的功能还不如wxs强大。此外头条系小程序自身不支持类似功能。
**平台差异说明**
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√(不支持nvue)|√|√|SJS|Filter|x|√|
**wxs示例**
以下是一些使用 WXS 的简单示例，要完整了解 WXS 语法，请参考[WXS 语法参考](https://developers.weixin.qq.com/miniprogram/dev/reference/wxs/)。本示例使用wxs响应touchmove事件，减少视图层与逻辑层通信，使滑动更加丝滑。
以下是一些使用 WXS 的简单示例，要完整了解 WXS 语法，请参考[WXS 语法参考](https://developers.weixin.qq.com/miniprogram/dev/reference/wxs/)。本示例使用wxs响应`touchmove`事件，减少视图层与逻辑层通信，使滑动更加丝滑。
```html
<template>
......@@ -954,7 +972,7 @@ uni-app可以将wxs代码编译到微信小程序、QQ小程序、5+APP上（`HB
</view>
</view>
</template>
<wxs module="test">
<script module="test" lang="wxs">
var startX = 0
var startY = 0
var lastLeft = 50; var lastTop = 50
......@@ -985,7 +1003,7 @@ uni-app可以将wxs代码编译到微信小程序、QQ小程序、5+APP上（`HB
touchstart: touchstart,
touchmove: touchmove
}
</wxs>
</script>
<script>
export default {
......@@ -1020,7 +1038,7 @@ uni-app可以将wxs代码编译到微信小程序、QQ小程序、5+APP上（`HB
支付宝小程序，百度小程序官方暂未支持事件响应，不过也可以使用对应的SJS、Filter过滤器实现一些数据处理的操作，以下代码展示了一个时间格式化的小功能
index.vue
`index.vue`
```html
<template>
......@@ -1033,8 +1051,8 @@ index.vue
</view>
</view>
</template>
<filter module="utils" src="./utils.filter.js"></filter>
<import-sjs module="utils" src="./utils.sjs" />
<script module="utils" lang="filter" src="./utils.filter.js"></script>
<script module="utils" lang="sjs" src="./utils.sjs"></script>
<script>
export default {
......@@ -1053,7 +1071,7 @@ index.vue
</script>
```
utils.sjs 与 utils.filter.js
`utils.sjs` 与 `utils.filter.js` 内容一致
```js
export default {
......@@ -1110,17 +1128,39 @@ export default {
**注意**
- **重要**编写wxs、sjs、filter.js 内容时必须遵循相应语法规范
引入方式
```html
<!-- 内联 -->
<script module="test" lang="wxs">
//...code
</script>
<script module="utils" lang="filter">
//...code
</script>
<!-- 外部引入 -->
<script module="utils" lang="wxs" src="./utils.wxs"></script>
<script module="utils" lang="filter" src="./utils.filter.js"></script>
<script module="utils" lang="sjs" src="./utils.sjs"></script>
```
- **【重要】** 编写wxs、sjs、filter.js 内容时必须遵循相应语法规范
- **【重要】** `module`所指定的模块名不可与`data`、`methods`、`computed`内的属性重名
- 目前各个小程序正在完善相关规范，可能会有较大改动，请务必仔细阅读相应平台的文档
- 支付宝小程序请使用sjs规范，[详见](https://docs.alipay.com/mini/framework/sjs)
- 支付宝小程序sjs只能定义在.sjs 文件中。然后使用```<import-sjs>```标签引入
- 支付宝小程序import-sjs的标签属性```name```、```from```被统一为了```module```、```src```以便后续实现多平台统一写法
- 支付宝小程序sjs只能定义在.sjs 文件中，然后使用```<script>```标签引入
- 支付宝小程序`script`的标签属性`name`、`from`被统一为了`module`、`src`以便后续实现多平台统一写法
- 百度小程序中请使用Filter规范，[详见](https://smartprogram.baidu.com/docs/develop/framework/view_filter/)
- 百度小程序Filter只能导出function函数
- 百度小程序Filter只能导出`function`函数
- 暂不支持在 wxs、sjs、filter.js 中调用其他同类型文件
- wxs、filter.js既能内联使用又可以外部引入，sjs只能外部引入
- mp-qq 目前对内联的 wxs 支持不好，部分写法会导致编译出错
- 在微信自定义组件中（wxcomponents）也可以使用wxs
- QQ小程序目前对内联的 wxs 支持不好，部分写法可能会导致编译出错，尽量使用外部引入的方式
- 在微信自定义组件中`wxcomponents`也可以使用wxs
- `nvue`页面暂不支持wxs、sjs、filter.js
- 各个`script`标签会分别被打包至对应支持平台，不需要额外写条件编译
- 自`HBuilderX 2.2.5-alpha`开始，不推荐使用各个小程序自有的引入方式，推荐使用`script`标签引入
## 致谢
......
docs/performance.md
浏览文件 @ f51b016b
......@@ -2,7 +2,9 @@
``uni-app`` 在 App 端或小程序端运行时，从架构上分为逻辑层和视图层两个部分。逻辑层负责储存数据和执行业务逻辑，视图层负责页面渲染。
页面加载时，联网和逻辑运算在逻辑层，然后会传递数据给视图层渲染。这种通信有损耗。同样，在视图层操作时，比如拖动页面，要实时传递事件给逻辑层接收，也是有损耗的。
页面加载时，联网和逻辑运算在逻辑层（Android是v8，iOS是jscore），然后会传递数据给视图层渲染。这种通信有损耗。同样，在视图层操作时，比如拖动页面，要实时传递事件给逻辑层接收，也是有损耗的。
在App端，nvue页面的视图层是由原生引擎渲染的，vue页面的视图层是os的webview渲染的。
#### 优化建议
......@@ -30,7 +32,7 @@
**长列表**
- 长列表中如果每个item有一个点赞按钮，点击后点赞数字+1，此时点赞组件必须是一个单独引用的组件，才能做到差量数据更新。否则会造成整个列表数据重载。（要求自定义组件模式）
- 长列表中每个item并不一定需要做成组件，取决于你的业务中是否需要差量更新某一行item的数据，如没有此类需求则不应该引入大量组件。（点击item后背景变色，属于css调整，没有更新data数据和渲染，不涉及这个问题）
- app端nvue的长列表应该使用list组件，有自动的渲染资源回收机制。
- app端nvue的长列表应该使用list组件，有自动的渲染资源回收机制。vue页面使用页面滚动的性能，好于使用scroll-view的区域滚动。
- 如需要左右滑动的长列表，请在HBuilderX新建uni-app项目选新闻模板，那是一个标杆实现。自己用swiper和scroll-view做很容易引发性能问题。
**减少一次性渲染的节点数量**
......@@ -71,7 +73,7 @@
**优化包体积**
* uni-app发行到小程序时，自带引擎只有几十K，主要是一个定制过的vue.js核心库。如果使用了es6转es5、css对齐的功能，可能会增大代码体积，可以配置这些编译功能是否开启。
* uni-app的H5端，自带了vue.js、vue-rooter、小程序ui库（如picker、switch等）、小程序的对齐js api。默认包体积约500k，服务器部署gzip后162k。可以在manifest配置[摇树优化](https://uniapp.dcloud.io/collocation/manifest?id=optimization)，按需使用组件和API。进行摇树优化后，且gzip后，框架体积仅92k，只是相当于vue.js和vue-root及部分es6 polyfill库的体积。
* uni-app的H5端，自带了vue.js、vue-rooter及部分es6 polyfill库，这部分的体积gzip后只有92k，和web开发使用vue基本一致。而内置组件ui库（如picker、switch等）、小程序的对齐js api等，相当于一个完善的大型ui库。但大多数应用不会用到所有内置组件和API。由此uni-app提供了摇树优化机制，未摇树优化前的uni-app整体包体积约500k，服务器部署gzip后162k。开启摇树优化需在manifest配置，[详情](https://uniapp.dcloud.io/collocation/manifest?id=optimization)。
* uni-app的App端，因为自带了一个独立v8引擎和小程序框架，所以比HTML5Plus或mui等普通hybrid的App引擎体积要大。Android基础引擎约15M。App还提供了扩展模块，比如地图、蓝牙等，打包时如不需要这些模块，可以裁剪掉，以缩小发行包体积。在 manifest.json-App模块权限 里可以选择。
* App端支持如果选择纯nvue项目（manifest里设置app-plus下的renderer:"native"），包体积可以进一步减少2M左右。
* uni-app的App端默认包含arm32和x86两个cpu的支持so库。这会增大包体积。如果你在意体积控制，可以在manifest里去掉x86 cpu的支持（manifest可视化界面-App其他设置里选择cpu），这可以减少包体积到9M。但代价是不支持intel的cpu了。一般手机都是arm的，仅个别少见的Android pad使用x86 cpu。另外as的模拟器里如果选择x86时也无法运行这种apk。
docs/quickstart.md
浏览文件 @ f51b016b
......@@ -192,7 +192,7 @@ vue create -p dcloudio/uni-preset-vue my-project
此时，会提示选择项目模板，初次体验建议选择 `hello uni-app` 项目模板，如下所示：
<div>
<img src="http://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/h5-cli-01.png" width="300">
<img src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/h5-cli-01.png" width="300">
</div>
#### 自定义模板
......@@ -240,9 +240,11 @@ npm run build:%PLATFORM%
#### 开发工具的区别
* ``cli``创建的项目，内置了d.ts，同其他常规npm库一样，可在[vscode](https://ask.dcloud.net.cn/article/36286)、[webstorm](https://ask.dcloud.net.cn/article/36307)等支持d.ts的开发工具里正常开发并有语法提示。
* 使用HBuilderX创建的项目不带d.ts，此时可以在项目下执行 ``npm i @types/uni-app -D``，来补充d.ts
* 使用HBuilderX创建的项目不带d.ts，HBuilderX内置了uni-app语法提示库。如需把HBuilderX创建的项目在其他编辑器打开并且补充d.ts，可以在项目下先执行 ``npm init``，然后``npm i @types/uni-app -D``，来补充d.ts。
* 但vscode等其他开发工具，在vue或uni-app领域，开发效率比不过HBuilderX。详见：[https://ask.dcloud.net.cn/article/35451](https://ask.dcloud.net.cn/article/35451)
* 发布App时，仍然需要使用HBuilderX。其他开发工具无法发布App，但可以发布H5、各种小程序。如需开发App，可以先在HBuilderX里运行起来，然后在其他编辑器里修改保存代码，代码修改后会自动同步到手机基座。
* 如果使用``cli``创建项目，那下载HBuilderX时只需下载10M的标准版即可。因为编译器已经安装到项目下了。
* 对 `cli` 使用有疑问，欢迎扫码加入 uni-app 微信交流群讨论：
<br/><img src="http://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/wx-barcode.png" width="250"/>
<br/><img src="https://img.cdn.aliyun.dcloud.net.cn/guide/uniapp/wx-barcode.png" width="250"/>
注意：HBuilderX创建的项目，一样可以使用npm，参考：[https://uniapp.dcloud.io/frame?id=npm%e6%94%af%e6%8c%81](https://uniapp.dcloud.io/frame?id=npm%e6%94%af%e6%8c%81)
docs/release.md
浏览文件 @ f51b016b
# uni-app 更新日志
======================================
#### 2.3.2.20190921
* App平台 修复 uni.writeBLECharacteristicValue 无法写入数据的 Bug [详情](https://ask.dcloud.net.cn/question/79204)
* App平台 修复 调用 uni.pageScrollTo 时页面内元素 fixed 定位失效的 Bug [详情](https://ask.dcloud.net.cn/question/73179)
* App平台 修复 调用 uni.setNavigationBarColor 导致其他页面状态栏颜色一起改变的 Bug
* App平台 修复 调用 uni.setNavigationBarColor 导致隐藏状态的导航栏显示的 Bug
* App平台 修复 调用 uni.switchTab 某些情况下白屏的 Bug
* App平台 修复 map组件的点击标记点事件（@markertap）参数中markerId属性不正确的Bug
* App-iOS平台 修复 slider组件中的内容可能出现重叠的Bug
* App-iOS平台 修复 iOS13上input组件设置自动聚焦无效的Bug
* App-iOS平台 修复 nvue 组件 refresh 某些情况下闪退的 Bug
* H5平台 修复 longpress 事件消息对象的 touches/changedTouches 属性不正确的 Bug [详情](https://ask.dcloud.net.cn/question/79149)
* uni统计 修复 统计数据上报失败 request 报错的 Bug
## 2.2.1.20190813
#### 2.3.1.20190920
* App平台 修复 vue页面 scroll-view 组件在 iOS13 无法滚动的 Bug [详情](https://ask.dcloud.net.cn/question/78627)
* H5平台 修复 uni.request 方法发起 GET 请求之前出现 OPTIONS 预检请求的 Bug
* 头条小程序 修复 this.$refs 部分场景无法获取组件引用的 Bug [#791](https://github.com/dcloudio/uni-app/issues/791)
* uni统计 修复 小程序端发行后所有页面都添加 onShareAppMessage 的 Bug [#792](https://github.com/dcloudio/uni-app/issues/792)
#### 2.3.0.20190919
* 【重要】uni统计平台上线，一份报表，掌握业务全景 [详情](https://tongji.dcloud.net.cn) 注意小程序需加 tongji.dcloud.io 到域名白名单
* 【重要】调整：编译模式默认为自定义组件模式。若开发者需要非自定义组件模式，需在manifest.json中明确配置usingComponents节点为false
* 【重要】公告：非自定义组件模式，将于2019年11月1日起，停止支持。请开发者尽快升级 [详情](https://ask.dcloud.net.cn/article/36385)
* 【重要】App/微信小程序/H5 新增 支持wxs，支付宝小程序平台支持SJS，百度小程序平台支持Filter [详情](https://uniapp.dcloud.io/frame?id=wxs)
* 【重要】App平台 优化使用Tab时应用的内存占用，提升Android平台窗体动画和页面滚动的平滑度（自定义组件模式）
* 【重要】App平台 iOS环境，uni-app 编译模式下的nvue页面及所有vue页面，web-view组件从UIWebview调整为WKWebview。[详情](https://ask.dcloud.net.cn/article/36348)
* 【重要】App平台 新增 nvue 页面支持 vuex 的使用 [详情](https://uniapp.dcloud.io/use-weex?id=vue-%e5%92%8c-nvue-%e5%85%b1%e4%ba%ab%e7%9a%84%e5%8f%98%e9%87%8f%e5%92%8c%e6%95%b0%e6%8d%ae)
* 新增 编译时增加警告信息（不影响运行）
* 新增 支持sass-loader 8.0.0版本 [#776](https://github.com/dcloudio/uni-app/issues/776)
* 优化 image 组件支持自闭合写法 [#625](https://github.com/dcloudio/uni-app/issues/625)
* 优化 autoprefixer 目标浏览器兼容，减少生成的 css 代码
* 修复 部分模板写法导致编译器报错的Bug [#604](https://github.com/dcloudio/uni-app/issues/604)
* 修复 mode 不正确导致 cli 下读取 .env 错误的Bug [#710](https://github.com/dcloudio/uni-app/issues/710)
* 修复 for 循环中绑定多个事件方法，参数获取不正确的Bug [#720](https://github.com/dcloudio/uni-app/issues/720)
* 修复 静态资源过大时编译报错的 Bug
* 修复 部分样式编译时未自动增加 webkit 前缀的 Bug [#769](https://github.com/dcloudio/uni-app/issues/769)
* App/H5/支付宝小程序平台 新增 导航栏支持配置图片(titleImage) [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App/H5/支付宝小程序平台 新增 支持导航栏透明(transparentTitle) [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App/H5平台 新增 uni.getSystemInfo 支持返回安全区信息（safeArea）
* App/H5平台 新增 swiper 组件支持 transition 事件
* App/H5平台 修复 input、textarea 组件禁用状态黑色文字在 iOS 颜色变浅的 Bug
* App平台 优化 页面背景样式生效时机，解决深色背景等特定场景下，页面切换时闪白的问题
* App平台 修复 iOS13 页面无法滚动的Bug [详情](https://ask.dcloud.net.cn/question/77877)
* App平台 新增 uni.onKeyboardHeightChange 支持监听键盘高度变化
* App平台 新增 uni.getSystemInfo 支持返回手机品牌信息（brand） [详情](https://ask.dcloud.net.cn/question/77313)
* App平台 新增 nvue 中支持 uni.scss
* App平台 新增 uni-app 编译模式下的 nvue 页面支持 recycle-list 组件 [详情](https://uniapp.dcloud.io/component/recycle-list)
* App平台 新增 uni-app 编译模式下的 nvue 页面支持 picker-view 组件
* App平台 优化 websocket 支持创建多个连接，支持收发 ArrayBuffer 类型数据
* App平台 优化 renderer配置为native的纯nvue项目，uni.request 发起网络请求时，Content-Type 默认设置为 application/json
* App平台 优化 uni.request 自动去除 url 首尾空白字符
* App平台 优化 input 组件 @focus 事件支持获取键盘高度
* App平台 优化 nvue Android系统switch的样式与性能
* App平台 优化 nvue button 组件内部支持嵌套 text 组件
* App平台 修复 nvue 环境 movable-area 组件手势和滚动冲突的 Bug
* App平台 修复 调用 setNavigationBarTitle 不生效的Bug
* App平台 修复 微信自定义组件运行时报错的Bug [详情](https://ask.dcloud.net.cn/question/77358)
* App平台 修复 键盘高度变化事件不生效的 Bug
* App平台 修复 页面中 web-view 组件的页面加载完成之前标题栏会显示 null 的 Bug
* App平台 修复 解决 scroll-view、movable-view 组件触摸滑动时会触发下拉刷新的 Bug
* App平台 修复 纯nvue项目 uni.scanCode、uni.chooseLocation 接口不触发回调的Bug
* App平台 修复 纯nvue项目 uni.stopPullDownRefresh 不生效的Bug
* App平台 修复 纯nvue项目 开发运行期间新增 nvue 页面，热更新白屏的Bug
* App-Android平台 修复 uni-app中网络请求设置method为DELETE时请求参数丢失的Bug [详情](https://ask.dcloud.net.cn/question/77624)
* App-Android平台 修复 uni-app自定义组件模式下websocket连接报some error occur错误的Bug [详情](https://ask.dcloud.net.cn/question/78789)
* App-Android平台 修复 nvue web-view组件无法使用定位功能的Bug [详情](https://ask.dcloud.net.cn/question/76909)
* App-Android平台 修复 nvue textarea、input组件首次触发focus事件时无法获取键盘高度的Bug [详情](https://ask.dcloud.net.cn/question/76923)
* App-Android平台 修复 nvue map组件中添加的子组件无法正常显示的Bug [详情](https://ask.dcloud.net.cn/question/78307)
* App-Android平台 修复 nvue video标签设置control属性为false时，未播放状态下仍然显示控制栏的Bug
* App-Android平台 修复 nvue input标签设置adjust-position属性不生效，及KeyboardHeightChange事件不触发的Bug [详情](https://ask.dcloud.net.cn/question/78796)
* App-Android平台 修复 HBuilderX2.2.0引出的uni原生插件调用（uni.requireNativePlugin）使用时报错的Bug [详情](https://ask.dcloud.net.cn/question/76962)
* App-iOS平台 修复 uni-app中subNVue页面可能无法接收到父页面通过subNVue.postMessage发送的消息的Bug [详情](https://ask.dcloud.net.cn/question/77312)
* App-iOS平台 修复 nvue iPhoneX设备软键盘弹出时页面偏移位置不准确的Bug [详情](https://ask.dcloud.net.cn/question/76783)
* App-iOS平台 修复 nvue map组件添加的子组件可能无法显示的Bug [详情](https://ask.dcloud.net.cn/question/76719)
* App-iOS平台 修复 nvue swipe组件高度动态变化后切页显示不正常的Bug [详情](https://ask.dcloud.net.cn/question/77500)
* App-iOS平台 修复 nvue video标签设置封面图片（poster）后动态修改src属性可能引起应用崩溃的Bug [详情](https://ask.dcloud.net.cn/question/77353)
* App-iOS平台 修复 nvue video标签设置自动播放（autoplay）为true不生效的Bug
* App-iOS平台 修复 nvue video标签中退出全屏后覆盖元素显示不正常的Bug
* App-iOS平台 修复 nvue input组件设置adjust-position属性值为false无效的Bug [详情](https://ask.dcloud.net.cn/question/78472)
* App-iOS平台 修复 nvue webSocket模块设置多个协议（protocol）导致连接服务器失败的Bug
* App-iOS平台 修复 nvue bindingx在uni-app编译模式下拖拽组件时偏移系数不正确的Bug
* App-iOS平台 修复 uni原生插件实现代理方法（application:openURL:options:）后与第三方应用交互（如调用微信登录）引起应用崩溃的Bug
* App-iOS平台 修复 uni原生插件实现代理方法（application:handleOpenURL:）不触发，导致无法获取第三方应用返回数据的Bug
* H5平台 新增 支持导航栏点击穿透配置（titlePenetrate） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* H5平台 新增 支持 icon 组件。注意此功能会与老版的uni ui的icon组件重名 [详情](https://ask.dcloud.net.cn/article/36404)
* H5平台 优化 uni.getNetworkType 支持 Safari 浏览器
* H5平台 修复 rich-text 内部节点包含多个 class 时渲染不正确的 Bug [#756](https://github.com/dcloudio/uni-app/issues/756)
* H5平台 修复 input 组件 confirm-type 值为 search 时文字垂直不居中的 Bug
* H5平台 修复 input 组件的 change 事件会冒泡到父组件的Bug [详情](https://ask.dcloud.net.cn/question/77962)
* H5平台 修复 animation 属性中部分动画不生效的 Bug
* H5平台 修复 svg 或非base64格式的 Data URI 无法使用的Bug [#668](https://github.com/dcloudio/uni-app/issues/668)
* 小程序平台 新增 uni.getMenuButtonBoundingClientRect 接口，可获取导航栏右上角胶囊按钮的布局位置信息 [详情](https://uniapp.dcloud.io/api/ui/menuButton?id=getmenubuttonboundingclientrect)
* 小程序平台 优化 发行时压缩 css 代码
* 微信小程序平台 修复 当使用小程序插件后，调用数组方法修改数组未触发界面渲染的 Bug [#694](https://github.com/dcloudio/uni-app/issues/694)
* 支付宝小程序平台 新增 支持分包加载功能
* 支付宝小程序 新增 button 组件 open-type 属性支持 getPhoneNumber
* 百度/头条小程序平台 修复 开发工具 sourcemap 无效的Bug [#724](https://github.com/dcloudio/uni-app/issues/724)
* hello uni-app 新增 nvue地图 组件及API示例
* hello uni-app 新增 全屏视频上下滑动的示例模板
* hello uni-app 新增 globalData和vuex的示例模板
* hello uni-app 优化 cover-view 组件示例(App端使用nvue实现)，支持在视频全屏界面覆盖遮罩物
* hello uni-app 优化 video 组件示例，新增播放、暂停、设置倍速等能力演示
* uni-ui 新增 SearchBar 搜索输入框
* uni-ui 新增 GoodsNav 商品详情页底部购物车、购买导航条
* uni-ui 新增 Fav 收藏按钮
* uni-ui 优化 SwipeAction 滑动操作组件，App平台、H5 平台、微信小程序平台利用 wxs 实现跟手式流畅拖动
* uni-ui 优化 Collapse 折叠面板在低配设备中动画卡顿的问题
* uni-ui 优化 LoadMore 加载图标可按平台配置或由用户指定，Android平台默认circle，iOS平台默认雪花
* uni-ui 优化 SwipeDot 优化指示器样式
* uni-ui 修复 Icons 组件在 H5 平台不显示的BUG。老用户请更新Icons组件 [详情](https://ask.dcloud.net.cn/article/36404)
* 新闻模板 优化 拖动标签卡时更快的渲染页面、无网络时引导用户设置
#### 2.2.8.20190918
* 【重要】uni统计平台上线，一份报表，掌握业务全景 [详情](https://tongji.dcloud.net.cn)
* 【重要】调整：编译模式默认为自定义组件模式。若开发者需要非自定义组件模式，需在manifest.json中明确配置usingComponents节点为false
* 【重要】公告：非自定义组件模式，将于2019年11月1日起，停止支持。请开发者尽快升级 [详情](https://ask.dcloud.net.cn/article/36385)
* 【重要】App/微信小程序/H5 新增 支持wxs，支付宝小程序平台支持SJS，百度小程序平台支持Filter [详情](https://uniapp.dcloud.io/frame?id=wxs)
* 【重要】App平台 优化使用Tab时应用的内存占用，提升Android平台窗体动画和页面滚动的平滑度（自定义组件模式）
* 【重要】App平台 iOS环境，uni-app 编译模式下的nvue页面及所有vue页面，web-view组件从UIWebview调整为WKWebview。[详情](https://ask.dcloud.net.cn/article/36348)
* 【重要】App平台 新增 nvue 页面支持 vuex 的使用 [详情](https://uniapp.dcloud.io/use-weex?id=vue-%e5%92%8c-nvue-%e5%85%b1%e4%ba%ab%e7%9a%84%e5%8f%98%e9%87%8f%e5%92%8c%e6%95%b0%e6%8d%ae)
* 新增 编译时增加警告信息（不影响运行）
* 新增 支持sass-loader 8.0.0版本 [#776](https://github.com/dcloudio/uni-app/issues/776)
* 优化 image 组件支持自闭合写法 [#625](https://github.com/dcloudio/uni-app/issues/625)
* 优化 autoprefixer 目标浏览器兼容，减少生成的 css 代码
* 修复 部分模板写法导致编译器报错的Bug [#604](https://github.com/dcloudio/uni-app/issues/604)
* 修复 mode 不正确导致 cli 下读取 .env 错误的Bug [#710](https://github.com/dcloudio/uni-app/issues/710)
* 修复 for 循环中绑定多个事件方法，参数获取不正确的Bug [#720](https://github.com/dcloudio/uni-app/issues/720)
* 修复 静态资源过大时编译报错的 Bug
* 修复 部分样式编译时未自动增加 webkit 前缀的 Bug [#769](https://github.com/dcloudio/uni-app/issues/769)
* App/H5/支付宝小程序平台 新增 导航栏支持配置图片（titleImage） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App/H5平台 新增 支持导航栏透明配置（transparentTitle） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App/H5平台 新增 uni.getSystemInfo 支持返回安全区信息（safeArea）
* App/H5平台 新增 swiper 组件支持 transition 事件
* App/H5平台 修复 input、textarea 组件禁用状态黑色文字在 iOS 颜色变浅的 Bug
* App平台 优化 页面背景样式生效时机，解决深色背景等特定场景下，页面切换时闪白的问题
* App平台 修复 iOS13 页面无法滚动的Bug [详情](https://ask.dcloud.net.cn/question/77877)
* App平台 新增 uni.onKeyboardHeightChange 支持监听键盘高度变化
* App平台 新增 uni.getSystemInfo 支持返回手机品牌信息（brand） [详情](https://ask.dcloud.net.cn/question/77313)
* App平台 新增 nvue 中支持 uni.scss
* App平台 新增 uni-app 编译模式下的 nvue 页面支持 recycle-list 组件 [详情](https://uniapp.dcloud.io/component/recycle-list)
* App平台 新增 uni-app 编译模式下的 nvue 页面支持 picker-view 组件
* App平台 优化 websocket 支持创建多个连接，支持收发 ArrayBuffer 类型数据
* App平台 优化 renderer配置为native的纯nvue项目，uni.request 发起网络请求时，Content-Type 默认设置为 application/json
* App平台 优化 uni.request 自动去除 url 首尾空白字符
* App平台 优化 input 组件 @focus 事件支持获取键盘高度
* App平台(Android系统) 优化 nvue 版switch的样式与性能
* App平台 优化 nvue button 组件内部支持嵌套 text 组件
* App平台 修复 调用 setNavigationBarTitle 不生效的Bug
* App平台 修复 微信自定义组件运行时报错的Bug [详情](https://ask.dcloud.net.cn/question/77358)
* App平台 修复 nvue 环境 movable-area 组件手势和滚动冲突的 Bug
* App平台 修复 键盘高度变化事件不生效的 Bug
* App平台 修复 页面中 web-view 组件的页面加载完成之前标题栏会显示 null 的 Bug
* App平台 修复 解决 scroll-view、movable-view 组件触摸滑动时会触发下拉刷新的 Bug
* App平台 修复 纯nvue项目中 uni.scanCode、uni.chooseLocation 接口不触发回调的Bug
* App平台 修复 纯nvue项目中 uni.stopPullDownRefresh 不生效的Bug
* App平台 修复 纯nvue项目中 开发运行期间新增 nvue 页面，热更新白屏的Bug
* H5平台 新增 支持导航栏点击穿透配置（titlePenetrate） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* H5平台 新增 支持 icon 组件
* H5平台 优化 uni.getNetworkType 支持 Safari 浏览器
* H5平台 修复 rich-text 内部节点包含多个 class 时渲染不正确的 Bug [#756](https://github.com/dcloudio/uni-app/issues/756)
* H5平台 修复 input 组件 confirm-type 值为 search 时文字垂直不居中的 Bug
* H5平台 修复 input 组件的 change 事件会冒泡到父组件的Bug [详情](https://ask.dcloud.net.cn/question/77962)
* H5平台 修复 animation 属性中部分动画不生效的 Bug
* H5平台 修复 svg 或非base64格式的 Data URI 无法使用的Bug [#668](https://github.com/dcloudio/uni-app/issues/668)
* 小程序平台 新增 uni.getMenuButtonBoundingClientRect 接口，可获取导航栏右上角胶囊按钮的布局位置信息 [详情](https://uniapp.dcloud.io/api/ui/menuButton?id=getmenubuttonboundingclientrect)
* 小程序平台 优化 发行时压缩 css 代码
* 微信小程序平台 修复 当使用小程序插件后，调用数组方法修改数组未触发界面渲染的 Bug [#694](https://github.com/dcloudio/uni-app/issues/694)
* 支付宝小程序平台 新增 支持分包加载功能
* 支付宝小程序 新增 button 组件 open-type 属性支持 getPhoneNumber
* 百度/头条小程序平台 修复 开发工具 sourcemap 无效的Bug [#724](https://github.com/dcloudio/uni-app/issues/724)
* hello uni-app 新增 nvue地图 组件及API示例
* hello uni-app 新增 全屏视频上下滑动 示例模板
* hello uni-app 优化 cover-view 组件示例(App端使用nvue实现)，支持在视频全屏界面覆盖遮罩物
* hello uni-app 优化 video 组件示例，新增播放、暂停、设置倍速等能力演示
* hello uni-app 新增 globalData和vuex的示例模板
* uni-ui 新增 SearchBar 搜索输入框
* uni-ui 新增 GoodsNav 商品详情页底部购物车、购买导航条
* uni-ui 新增 Fav 收藏按钮
* uni-ui 优化 SwipeAction 滑动操作组件，App平台、H5 平台、微信小程序平台使用 wxs 实现跟手式流畅拖动
* uni-ui 优化 Collapse 折叠面板在低配设备中动画卡顿的问题
* uni-ui 优化 LoadMore 加载图标可按平台配置或由用户指定，Android平台默认circle，iOS平台默认雪花
* uni-ui 优化 SwipeDot 优化指示器样式
* uni-ui 修复 Icons 组件在 H5 平台不显示的BUG
* 新闻模板 优化 拖动标签卡时更快的渲染页面、无网络时引导用户设置
#### 2.2.7.20190916-alpha
* 【重要】App平台 优化 不显示的Tab页面，释放渲染内存占用，提升窗体动画和页面滚动的平滑度
* 【重要】uni统计 优化 统计接口上报性能，已启用uni统计的历史项目，请在小程序后台request安全域名中新增（不是替换）：tongji.dcloud.io
* 修复 兼容sass-loader 8.0.0版本 [#776](https://github.com/dcloudio/uni-app/issues/776)
* App平台 新增 nvue 中支持 uni.scss
* App平台 修复 setNavigationBarTitle不生效的Bug
* hello uni-app 优化 cover-view 组件示例(App端使用nvue实现)，支持在视频全屏界面覆盖遮罩物
* hello uni-app 优化 video 组件示例，新增播放、暂停、设置倍速等能力演示
#### 2.2.6.20190914-alpha
* 【重要】 App平台 优化使用Tab时应用的内存占用，提升窗体动画和页面滚动的平滑度（自定义组件模式）
* 【重要】 公告：非自定义组件模式，将于11月1日起，停止支持。请开发者尽快升级
* 新增 编译时增加警告信息（不影响运行）
* 修复 静态资源过大时编译报错的 Bug
* 修复 部分样式编译时未自动增加 webkit 前缀的 Bug [#769](https://github.com/dcloudio/uni-app/issues/769)
* App平台/H5平台 新增 支持导航栏透明配置（transparentTitle） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App平台/H5平台 修复 input、textarea 组件禁用状态黑色文字在 iOS 颜色变浅的 Bug
* App平台 新增 导航栏支持配置图片（titleImage） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* App平台 新增 nvue 环境支持 recycle-list 组件 [详情](https://uniapp.dcloud.io/component/recycle-list)
* App平台 新增 nvue 环境支持 picker-view 组件
* App平台 修复 nvue 环境 movable-area 组件手势和滚动冲突的 Bug
* App平台 优化 websocket 支持创建多个连接，支持收发 ArrayBuffer 类型数据
* App平台 修复 键盘高度变化事件不生效的 Bug
* App平台 修复 页面中 web-view 组件的页面加载完成之前标题栏会显示 null 的 Bug
* H5平台 新增 支持导航栏点击穿透配置（titlePenetrate） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* H5平台 修复 rich-text 内部节点包含多个 class 时渲染不正确的 Bug [#756](https://github.com/dcloudio/uni-app/issues/756)
* uni统计 运行测试时不再上报数据，仅发行后才报数
* uni统计 修复预览模式自定义统计（uni.report）报错的问题
#### 2.2.5.20190907-alpha
* 【重要】新增 nvue 页面支持 vuex 的使用 [详情](https://uniapp.dcloud.io/use-weex?id=vue-%e5%92%8c-nvue-%e5%85%b1%e4%ba%ab%e7%9a%84%e5%8f%98%e9%87%8f%e5%92%8c%e6%95%b0%e6%8d%ae)
* 【重要】调整 App平台 iOS下，vue及nvue页面的uni-app编译模式下，web-view组件从UIWebview改为WKWebview。[详情](https://ask.dcloud.net.cn/article/36348)
* 优化 wxs 支持script方式写法，方便着色、格式化、语法校验 [详情](https://uniapp.dcloud.io/frame?id=wxs)
* 优化 image 组件支持自闭合写法 [#625](https://github.com/dcloudio/uni-app/issues/625)
* 优化 autoprefixer 目标浏览器兼容，减少生成的 css 代码
* 修复 部分模板写法导致编译器报错的Bug [#604](https://github.com/dcloudio/uni-app/issues/604)
* 修复 mode 不正确导致 cli 下读取 .env 错误的Bug [#710](https://github.com/dcloudio/uni-app/issues/710)
* 修复 for 循环中绑定多个事件方法，参数获取不正确的Bug [#720](https://github.com/dcloudio/uni-app/issues/720)
* App/H5平台 新增 uni.getSystemInfo 支持返回安全区信息（safeArea）
* App/H5平台 新增 swiper 组件支持 transition 事件
* App平台 优化 tab切换减少白屏概率
* App平台 优化 页面背景样式生效时机，解决深色背景等特定场景下，页面切换时闪白的问题
* App平台 修复 iOS13 页面无法滚动的Bug [详情](https://ask.dcloud.net.cn/question/77877)
* App平台 新增 uni.getSystemInfo 支持返回手机品牌信息（brand） [详情](https://ask.dcloud.net.cn/question/77313)
* App平台 修复 纯nvue项目中 uni.scanCode、uni.chooseLocation 接口不触发回调的Bug
* App平台 修复 纯nvue项目中 uni.stopPullDownRefresh 不生效的Bug
* App平台 修复 纯nvue项目中 开发运行期间新增 nvue 页面，热更新白屏的Bug
* App平台 优化 nvue Android版switch的样式与性能
* App平台 优化 nvue button 组件内部支持嵌套 text 组件
* H5平台/支付宝平台 新增 导航栏配置项titleImage（导航栏标题图） [详情](https://uniapp.dcloud.io/collocation/pages?id=style)
* H5平台 修复 input 组件的 change 事件会冒泡到父组件的Bug [详情](https://ask.dcloud.net.cn/question/77962)
* H5平台 修复 svg 或非base64格式的 Data URI 无法使用的Bug [#668](https://github.com/dcloudio/uni-app/issues/668)
* 小程序平台 新增 uni.getMenuButtonBoundingClientRect 接口，可获取导航栏右上角胶囊按钮的布局位置信息 [详情](https://uniapp.dcloud.io/api/ui/menuButton?id=getmenubuttonboundingclientrect)
* 小程序平台 优化 发行时压缩 css 代码
* 百度/头条小程序平台 修复 开发工具 sourcemap 无效的Bug [#724](https://github.com/dcloudio/uni-app/issues/724)
* 支付宝小程序 新增 button 组件 open-type 属性支持 getPhoneNumber
* hello uni-app 新增 nvue地图 组件及API示例
* hello uni-app 新增 全屏视频上下滑动 示例模板
* uni-ui 新增 SearchBar 搜索输入框
* uni-ui 新增 GoodsNav 商品详情页底部购物车、购买导航条
* uni-ui 新增 Fav 收藏按钮
* uni-ui 优化 SwipeAction 滑动操作组件，App平台、H5 平台、微信小程序平台使用 wxs 实现跟手式流畅拖动
* uni-ui 优化 Collapse 折叠面板在低配设备中动画卡顿的问题
* uni-ui 优化 LoadMore 加载图标可按平台配置或由用户指定，Android平台默认circle，iOS平台默认雪花
* uni-ui 优化 SwipeDot 优化指示器样式
* uni-ui 修复 Icons 组件在 H5 平台不显示的BUG
* 新闻模板 优化 拖动标签卡时更快的渲染页面、无网络时引导用户设置
* uni统计 修复 页面标题和页面 url 不匹配的Bug
* uni统计 修复 选项卡页面 url 上报不正确的Bug
#### 2.2.4.20190823-alpha
* 【重要】App/微信小程序平台 新增 支持wxs，支付宝小程序平台支持SJS，百度小程序平台支持Filter [详情](https://uniapp.dcloud.io/frame?id=wxs)
* App平台 修复 微信自定义组件运行时报错的Bug [详情](https://ask.dcloud.net.cn/question/77358)
#### 2.2.3.20190822-alpha
* 【重要】uni统计平台上线，一份报表，掌握业务全景 [详情](https://tongji.dcloud.net.cn)
* App平台 新增 uni.onKeyboardHeightChange 支持监听键盘高度变化
* App平台 优化 renderer配置为native的纯nvue项目，uni.request 发起网络请求时，Content-Type 默认设置为 application/json
* App平台 优化 input 组件 @focus 事件支持获取键盘高度
* App平台 优化 uni.request 自动去除 url 首尾空白字符
* App平台 修复 解决 scroll-view、movable-view 组件触摸滑动时会触发下拉刷新的 Bug
* H5平台 新增 支持 icon 组件
* H5平台 优化 uni.getNetworkType 支持 Safari 浏览器
* H5平台 修复 input 组件 confirm-type 值为 search 时文字垂直不居中的 Bug
* H5平台 修复 animation 属性中部分动画不生效的 Bug
* 微信小程序平台 修复 当使用小程序插件后，调用数组方法修改数组未触发界面渲染的 Bug [#694](https://github.com/dcloudio/uni-app/issues/694)
* 支付宝小程序平台 新增 支持分包加载功能
#### 2.2.2.20190816
* App平台 修复 uni.chooseLocation 界面搜索地点导致地图高度异常的Bug [详情](https://ask.dcloud.net.cn/question/76645)
#### 2.2.1.20190813
* App平台 修复 uni.request 接口中 responseType 参数设置为 arraybuffer 时,请求无效的 Bug [详情](https://ask.dcloud.net.cn/question/66153)
* H5平台 修复 开启摇树优化（treeShaking）后，多构建出一份无效文件的Bug [#638](https://github.com/dcloudio/uni-app/issues/638)
## 2.2.0.20190812
#### 2.2.0.20190812
* 【重要】H5平台 新增 支持配置摇树优化，打包时裁剪不需要的组件及API，大幅减少H5框架的发行体积，提高首次加载渲染速度 [详情](https://uniapp.dcloud.io/collocation/manifest?id=optimization)
* 【重要】App平台 自定义组件模式 优化 uni.request 的实现，加快联网速度，尤其是上拉翻页的速度
* 【重要】App平台 支持纯 nvue 项目，manifest配置 "app-plus" -> "renderer":"native"，可不加载基于 webview 的运行框架，减少包体积、提升启动速度。（新建项目选新闻模板可体验）
......@@ -42,7 +322,7 @@
* 新闻/资讯App模板 所有页面均使用nvue实现
## 2.1.3.20190724
#### 2.1.3.20190724
* 修复 项目路径包含空格时，debugger 的 sourcemap 不正确导致无法打断点的Bug
* App平台 修复 input 组件 type 值为 number 时 password 属性不生效的 Bug [#556](https://github.com/dcloudio/uni-app/issues/556)
* App平台 修复 取消扫码会触发扫码成功回调的 Bug
......@@ -52,7 +332,7 @@
* 百度小程序平台 修复 uni.request 方法 dataType 设置为非 json 类型，仍按 json 解析的 Bug [#558](https://github.com/dcloudio/uni-app/issues/558)
## 2.1.1.20190716
#### 2.1.1.20190716
* 修复 TypeScript 项目中包含 nvue 时编译报错的Bug
* App端 优化 titleNView 配置为字符串"false"时，等同于布尔型false，均为隐藏导航栏
* App端（Android平台） 修复部分场景下，导航栏标题显示为页面url的Bug
......@@ -60,7 +340,7 @@
* H5端 修复 input 组件设置高度后文字默认未垂直居中的Bug
* hello uni-app 修复顶部选项卡（nvue版本）下拉刷新无法回弹的Bug
## 2.1.0.20190713
#### 2.1.0.20190713
* 【重要】App平台 新增 debug调试功能（限自定义组件模式），支持vue/nvue页面断点调试、支持nvue页面element审查 [详情](https://uniapp.dcloud.io/snippet?id=%e5%85%b3%e4%ba%8e-app-%e7%9a%84%e8%b0%83%e8%af%95)
* 【重要】App平台 nvue 新增 uni-app编译模式。以后同时存在weex编译模式和uni-app编译模式。uni-app编译模式将不再使用weex组件，而是改用uni基础组件，目前已支持部分组件，并支持nvue页面编译到H5和小程序端 [详情](https://ask.dcloud.net.cn/article/36074)
* 【重要】App平台 nvue 新增 编译时校验css合法性，对于App平台的nvue不支持的样式在控制台给予告警（不影响编译结果） [详情](https://ask.dcloud.net.cn/article/36093)
......@@ -130,7 +410,7 @@
* 登录模板 修复 在头条小程序上自定义组件编译模式下输入框样式错乱的 Bug
## 2.0.0.20190610
#### 2.0.0.20190610
* 【重要】App平台 新增 subNVue ，支持使用原生组件绘制自定义导航栏、全屏遮罩等 [详情](https://uniapp.dcloud.io/api/window/subNVues)
* 【重要】支付宝/百度/头条小程序平台 新增 支持自定义组件模式，提升性能和增强vue语法支持，[详见](https://ask.dcloud.net.cn/article/35843)
* 新增 uni.$on,uni.$once,uni.$off,uni.$emit 方法，提供更优雅的页面间通信解决方案 [详情](https://uniapp.dcloud.io/api/window/communication)
......@@ -170,16 +450,16 @@
* hello uni-app 新增 editor 富文本编辑器示例
* hello uni-app 在支付宝/百度/头条小程序平台，开启[自定义组件模式](https://ask.dcloud.net.cn/article/35843)
## 1.9.9.20190522
#### 1.9.9.20190522
* 【重要】 App平台 nvue中可使用所有plus API，大幅改进weex API能力不足的问题（限自定义组件模式）
* App平台 修复 在 onLaunch 或首页的 onLoad/onReady 等生命周期内路由跳转失败的Bug [详情](https://ask.dcloud.net.cn/question/71248)
* App平台 修复 uni.previewImage 不传 current 参数可能导致运行报错的Bug
* App平台 修复 onTabItemTap 触发时机，修改为每次点击切换均触发（原来的逻辑是首次切换不触发）
## 1.9.8.20190518
#### 1.9.8.20190518
* 修复 1.9.7引入的 @-moz-keyframes @-ms-keyframes @-o-keyframes 编译报错 [详情](https://ask.dcloud.net.cn/question/71173) 。另注意手机端不应该添加-moz、-ms、-o等前缀语法
## 1.9.7.20190517
#### 1.9.7.20190517
* 修复 使用预编译语言部分情况下条件编译无效的Bug [详情](https://ask.dcloud.net.cn/question/70065)
* uni.previewImage 支持传入图片的索引值 [详情](https://uniapp.dcloud.io/api/media/image?id=previewimage)
* 微信平台 兼容微信开发者工具-开发版(Nightly Build)
......@@ -214,7 +494,7 @@
* hello uni-app 新增 指纹示例
* hello uni-app 新增 SQLite 示例
## 1.9.4.20190426
#### 1.9.4.20190426
* 修复 特定场景执行发行导致文件体积增大的问题 [详情](https://ask.dcloud.net.cn/question/69568)
* App平台 新增 video 组件 支持 direction 属性，可控制视频全屏方向 [详情](https://uniapp.dcloud.io/component/video)
* App平台 修复 input 组件 设置 type 属性为 idcard 时，无法输入字母 `X` 的bug
......@@ -229,7 +509,7 @@
* hello uni-app 优化 从列表到详情示例的上拉体验
## 1.9.3.20190422
#### 1.9.3.20190422
* 新增 自定义组件模式下 组件支持通过 extends mixins 继承 props [详情](https://ask.dcloud.net.cn/question/69051)
* 新增 template模板模式下 TypeScript工程支持使用装饰符 @Component
* App平台 自定义组件模式 新增 获取原生地图对象的方法 MapContext.$getAppMap() [详情](https://uniapp.dcloud.io/api/location/map?id=createmapcontext)
......@@ -252,15 +532,15 @@
* hello uni-app 优化 分享示例，分享类型和对应支持的分享渠道关联（如选择图文分享时，QQ分享渠道自动变为可不用状态）
* hello uni-app 优化 echarts 示例的传值方式，解决百度小程序不显示的问题
## 1.9.2.20190417
#### 1.9.2.20190417
* App平台 新增 自定义组件模式下输出日志时显示正确的行号
* H5平台 修复 API 返回的 Promise 对象不正确的问题 [详情](https://ask.dcloud.net.cn/question/68867)
## 1.9.1.20190415
#### 1.9.1.20190415
* 修复 调用 uni 方法返回的 Promise 对象不正确的问题 [#295](https://github.com/dcloudio/uni-app/issues/295)
* App端 新增 自定义组件模式下支持 loadFontFace 方法动态加载字体 [详情](https://uniapp.dcloud.io/api/ui/font?id=loadfontface)
## 1.9.0.20190412
#### 1.9.0.20190412
* 【重要】App平台 升级为新版编译器（自定义组件模式），提升App启动速度、减少js阻塞、提升组件性能、支持过滤器等更多vue语法 [详情](https://ask.dcloud.net.cn/article/35818)
* 【重要】插件市场支持付费原生插件，欢迎插件作者们踊跃提交原生插件。示例[https://ext.dcloud.net.cn/plugin?id=135](https://ext.dcloud.net.cn/plugin?id=135)
* 新增 自定义组件模式下，支持在 `v-for` 中使用 `v-model`、`v-bind` 指令的 `sync` 修饰符
......@@ -289,14 +569,14 @@
* hello uni-app 新增 在 uni-app 中使用第三方微信小程序组件（vant ui）的示例
* hello uni-app 强化`通过scheme打开三方app示例`，直接打开应用商店指定应用方便评分、直接打开QQ联系人聊天、地图指定位置导航、打开淘宝指定页面。
## 1.8.2.20190401
#### 1.8.2.20190401
* 新增 微信小程序启用`自定义组件模式`时，支持v-text指令
## 1.8.1.20190330
#### 1.8.1.20190330
* 微信小程序 修复 text 组件内文字不能换行以及不显示空格的问题 [详情](https://ask.dcloud.net.cn/question/67894)
* App平台（Android） 修复 部分低版本 Android 手机执行 uni.reLaunch() 报错的问题 [详情](https://ask.dcloud.net.cn/question/67888)
## 1.8.0.20190330
#### 1.8.0.20190330
* 【重要】架构全新重写，大幅提升微信小程序端的性能体验，并增加若干 Vue 语法支持。[详情](https://ask.dcloud.net.cn/article/35699)
* 【重要】App平台 新增 UniPush推送服务，统一手机厂商（苹果、华为、小米、OPPO、魅族）和三方推送（个推）通道，提升推送消息送达率。[详情](https://ask.dcloud.net.cn/article/35622)
* App平台 优化数据通讯机制，修复滚动监听延迟的问题
......@@ -321,7 +601,7 @@
* hello uni-app 修复 im 示例 message 属性类型错误的bug
* hello uni-app 修复 uParse 在部分场景下，显示异常的bug
## 1.7.0.20190314
#### 1.7.0.20190314
* 【重要】支持App资源在线热更新 [详情](https://ask.dcloud.net.cn/article/35667)
* 修复 uni.webview.js 在头条小程序真机环境无效的问题 [v1.5.0](https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.0.js)
* 修复 rich-text 组件 ins 标签嵌套在 span 标签中无法渲染的问题 [详情](https://ask.dcloud.net.cn/question/65382)
......@@ -373,7 +653,7 @@
* hello uni-app 新增 iOS端隐藏软键盘上的导航条示例
## 1.6.2.20190220
#### 1.6.2.20190220
* 【重要】新增 uni-app 支持发行到头条小程序 [详情](https://ask.dcloud.net.cn/article/35563)
* 新增 窗口大小变化监听接口 uni.onWindowResize、uni.offWindowResize [详情](https://uniapp.dcloud.io/api/ui/window?id=onwindowresize)
* 修复 upx 负数转换和正数不一致的问题 [#180](https://github.com/dcloudio/uni-app/issues/180)
......@@ -398,13 +678,13 @@
* hello uni-app 新增 导航栏带搜索框的示例
## 1.5.4.20190127
#### 1.5.4.20190127
* 修复 错误过滤css属性选择器通配符（*），注意：非属性选择器中依然不支持通配符（*）
* 修复 未检测到微信开发者工具时，特殊情况编译卡死的bug
* 优化 微信小程序在特定场景数据渲染慢的问题
## 1.5.2.20190121
#### 1.5.2.20190121
* 修复 编译至 app 时触发 babel 500kb 限制
* 修复 文本节点未移除前后空格及换行符
* 修复 scss,less,stylus等文件引用的 css 文件中条件编译不生效
......@@ -412,13 +692,13 @@
* 优化 自动移除 css 文件中的多余分号
* 优化 自动移除 css 文件中的 * 通配符选择器
## 1.5.1.20190120
#### 1.5.1.20190120
* 修复 components 目录引用组件查找失败的问题
* 修复 @import 引用 css 文件查找失败的问题
* 修复 组件嵌套 slot 导致的事件冲突问题
* 优化 发行至小程序的包体积
## 1.5.0.20190119
#### 1.5.0.20190119
* 【重要】变更 为加快调试速度，运行到微信小程序时取消代码压缩。正式发布，需点击发行菜单操作
* 优化 首页未渲染时不关闭splash，避免白屏（手动设置延迟关闭splash不再生效）
* 优化 减小编译器体积，精简依赖文件
......@@ -467,10 +747,10 @@
* hello uni-app 优化 H5 平台模板文件更名为 template.h5.html，避免文件名引发的误解
* hello uni-app 更新 city.data.js，使用最新的城市区县数据
## 1.4.1.20181228
#### 1.4.1.20181228
* 修复 CSS中条件编译导致运行至App和微信小程序失败的bug
## 1.4.0.20181227
#### 1.4.0.20181227
* 【重要】新增 uni-app添加支付宝和百度小程序运行 [详情](https://ask.dcloud.net.cn/article/35393)
* 【重要】新增 uni-app插件市场，支持前端组件、js sdk、页面模板、项目模板、原生插件等多种类型 [https://ext.dcloud.net.cn](https://ext.dcloud.net.cn)
* 【重要】新增 uni-app支持原生插件云打包
......@@ -503,7 +783,7 @@
* hello uni-app 优化 H5平台放开手势识别、图标裁剪等与 canvas 有关的示例
## 1.3.1.20181211
#### 1.3.1.20181211
* 优化 编译时提供更明确的错误提示
* 优化 支持在 main.js 引入 css 模块
* 修复 onReady 触发两次的问题
......@@ -528,10 +808,10 @@
* H5平台 修复 uni.request GET 类型请求的 url 拼接不规范导致部分服务器无法识别参数的问题
* H5平台 修复 WebSocket 事件监听报错的bug
## 1.2.1.20181126
#### 1.2.1.20181126
* 修复 真机运行到不支持viewport-fit=cover属性的设备上时，控制台出现相关警告的问题
## 1.2.0.20181122
#### 1.2.0.20181122
* 【重要】uni-app 支持发布到H5平台 注意事项参考[ask.dcloud.net.cn/article/35232](https://ask.dcloud.net.cn/article/35232)
* uni-app框架开源，欢迎大家star鼓励，[github地址](https://github.com/dcloudio/uni-app)
* uni-app支持通过vue-cli脚手架创建项目模板并运行到H5平台
......@@ -559,7 +839,7 @@
* 优化 hello uni-app 示例，样式更统一，uni.css有较大升级，老项目升级时需注意测试
## 1.1.0.20181030
#### 1.1.0.20181030
* 【重要】uni-app的官方视频教程发布了！ [参考](https://ke.qq.com/course/343370)
* 【重要】新增 web-view组件在App环境支持加载本地html文件，方便引用dom相关库及方便5+项目向uni-app分步迁移。[参考](https://uniapp.dcloud.io/component/web-view)
* 新增 自定义返回逻辑，点击手机back时可先关闭弹出类自定义组件。 [参考](https://ask.dcloud.net.cn/article/35120)
......@@ -583,7 +863,7 @@
* hello uni-app 新增 表单验证 模板(感谢网友hcoder-深海)
## 1.0.1.20181012
#### 1.0.1.20181012
* 优化 uni.chooseImage 在App平台补齐sizeType参数，可直接压缩图片，不需要使用plus api压缩了
* 修复 video组件 初始化时报错的问题
* 修复 video组件 poster属性不支持本地路径的问题
......@@ -593,7 +873,7 @@
* 修复 部分手机桌面启动uni-app，首页偶发渲染白屏的bug
* 修复 canvas API uni.canvasToTempFilePath接口在canvas中含有图像时调用失败的bug
## 1.0.0.20181010
#### 1.0.0.20181010
* 【重要】开放 uni-app支持原生sdk集成，离线打包，自由扩展原生能力 [参考](https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/104)
* 【重要】开放 兼容微信小程序 JS SDK，丰富的小程序生态内容可直接引入uni-app并且3端通用 [参考文档及各种小程序SDK资源汇总](https://ask.dcloud.net.cn/article/35070)
* 【重要】开放 兼容微信小程序自定义组件并且3端通用 [参考](https://uniapp.dcloud.io/frame?id=%E5%B0%8F%E7%A8%8B%E5%BA%8F%E7%BB%84%E4%BB%B6%E6%94%AF%E6%8C%81)
......@@ -627,7 +907,7 @@
## 0.1.50.20180918-alpha
#### 0.1.50.20180918-alpha
* 优化 下拉刷新配置
* 修复 uploadFile 参数 files 不生效
* 修复 组件内联 style 中使用 background-image 相对路径不生效
......@@ -635,7 +915,7 @@
* 修复 部分历史创建的uni-app项目在iOS平台真机运行报错的bug
* 修复 模板 索引列表在微信小程序平台，滑动右侧索引导致整体界面跟随滑动的bug
## 0.1.49.20180917
#### 0.1.49.20180917
* 【重要】 新增 upx 作为响应式尺寸单位，px 变为传统的物理像素，历史项目升级参考 [教程](https://ask.dcloud.net.cn/article/35014)
* 新增 支持注册全局组件 [文档](https://uniapp.dcloud.io/use?id=%E5%85%A8%E5%B1%80%E7%BB%84%E4%BB%B6)
* 新增 pages.json app-plus 支持pullToRefresh配置 [文档](https://uniapp.dcloud.io/collocation/pages?id=下拉刷新)
......@@ -665,7 +945,7 @@
## 0.1.48.20180906-alpha
#### 0.1.48.20180906-alpha
* 更新 mpvue 相关插件至最新
* 新增 小程序平台 分包加载，参考[pages.json配置说明](https://uniapp.dcloud.io/collocation/pages?id=subpackages)
* 新增 TypeScript 预编译器支持，实现了 <script lang="ts" src="xx.ts"></script> 引用方式的自动识别
......@@ -690,11 +970,11 @@
* 新增 [mpvue项目（组件）迁移指南、示例及资源汇总](https://ask.dcloud.net.cn/article/34945)
## 0.1.47.20180823-alpha
#### 0.1.47.20180823-alpha
* 修复 通过<style lang="less"></style>方式使用less、scss、stylus预编译语言开发，云端打包时编译报错的问题
## 0.1.47.20180821-alpha
#### 0.1.47.20180821-alpha
* 新增 支持vue里通过<style lang="less"></style>方式使用less、scss、stylus这3种预编译语言。需先在HBuilderX插件安装中安装对应编译插件
* 新增 pages.json 中 globalStyle, style 节点支持分平台配置，可在App侧单独定义titleNView。[参考pages.json说明](https://uniapp.dcloud.io/collocation/pages?id=app-plus)
* 新增 App中监听原生Title的按钮点击事件onNavigationBarButtonTap
......@@ -721,7 +1001,7 @@
* hello uni-app：新增 模板 问题反馈
## 0.1.46.20180810-alpha
#### 0.1.46.20180810-alpha
* 修复 Android4.4、5.0的兼容问题
* 修复 不支持iOS模拟器的问题
* 优化 iOS上的运行性能，尤其是示例中模板tab示例的卡顿
......@@ -744,7 +1024,7 @@
* hello uni-app：新增商品列表模板
## 0.1.45.20180728-alpha
#### 0.1.45.20180728-alpha
* 【重要】新增uni-app，使用vue技术，开发一次，iOS、Android、微信小程序三端同时生成。[详见](https://uniapp.dcloud.io/)
* 【重要】调整uniapp策略，之前的原生渲染uniapp改为nml项目[详见](https://ask.dcloud.net.cn/article/13507)
* uni-app：新增条件编译，采用类似 //#ifdef APP-PLUS 的写法做平台条件编译，代码块名为ifdef，还可双击ifdef选中整体代码段落。[详见](https://uniapp.dcloud.io/platform)
docs/snippet.md
浏览文件 @ f51b016b
### 使用代码块直接创建组件模板
为提升开发效率，HBuilderX将 ```uni-app``` 常用代码封装成了以 ```u``` 开头的代码块，如在 ```template``` 标签内输入 ```ulist``` 回车，会自动生成如下代码：
```
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-navigate uni-navigate-right" v-for="(item,index) in list" :key="index">
{{item.value}}
</view>
</view>
</view>
```
代码块分为Tag代码块、JS代码块，如在 ```script``` 标签内输入 ```uShowToast``` 回车，会自动生成如下代码：
```
uni.showToast({
title: '',
mask: false
duration: 1500
});
```
```uni-app```已支持代码块见下方列表。
#### Tag代码块
- uButton
- uCheckbox
- uGrid：宫格，需引用uni ui
- uList：列表，需引用uni ui
- uListMedia
- uRadio
为提升开发效率，HBuilderX将 ```uni-app``` 常用代码封装成了以 ```u``` 开头的代码块，如在 ```template``` 标签内输入 ```ulist``` 回车，会自动生成如下代码：
```
<view class="uni-list">
<view class="uni-list-cell">
<view class="uni-list-cell-navigate uni-navigate-right" v-for="(item,index) in list" :key="index">
{{item.value}}
</view>
</view>
</view>
```
代码块分为Tag代码块、JS代码块，如在 ```script``` 标签内输入 ```uShowToast``` 回车，会自动生成如下代码：
```
uni.showToast({
title: '',
mask: false
duration: 1500
});
```
```uni-app```已支持代码块见下方列表。
#### Tag代码块
- uButton
- uCheckbox
- uGrid：宫格，需引用uni ui
- uList：列表，需引用uni ui
- uListMedia
- uRadio
- uSwiper
- ......
......@@ -42,25 +42,25 @@ uni.showToast({
除组件外，其他常用代码块包括：
- viewfor：生成一段带有v-for循环结构的视图代码块
- vbase：生成一段基本的vue代码结构
#### JS代码块
##### uni api代码块
- uRequest
- uGetLocation
- uShowToast
- uShowLoading
- uHideLoading
- uShowModal
- uShowActionSheet
- uNavigateTo
- uNavigateBack
- uRedirectTo
- uStartPullDownRefresh
- uStopPullDownRefresh
- uLogin
- uShare
- vbase：生成一段基本的vue代码结构
#### JS代码块
##### uni api代码块
- uRequest
- uGetLocation
- uShowToast
- uShowLoading
- uHideLoading
- uShowModal
- uShowActionSheet
- uNavigateTo
- uNavigateBack
- uRedirectTo
- uStartPullDownRefresh
- uStopPullDownRefresh
- uLogin
- uShare
- uPay
- ......
......@@ -74,12 +74,12 @@ uni.showToast({
- vComponents：输出 components: {}
##### 其他常用js代码块
- iff：简单if
- forr：for循环结构体
- fori：for循环结构体并包含i
- funn：函数
- iff：简单if
- forr：for循环结构体
- fori：for循环结构体并包含i
- funn：函数
- funa：匿名函数
- rt：return true
- rt：return true
- clog：输出："console.log()"
- clogvar：增强的日志输出，可同时把变量的名字打印出来
- varcw：输出："var currentWebview = this.$mp.page.$getAppWebview()"
......@@ -114,45 +114,40 @@ uni.showToast({
![uni-app](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug2.png)
### 关于 App 的调试
自 `HBuilderX 2.0.3+ Alpha` 版本起开始支持 `App` 端的调试
#### 打开调试窗口
在 `HBuilderX` 中，正确运行项目： `运行 --> 运行到手机或模拟器 --> 选择设备`，项目启动后，在下方的控制台选择 `debug` 图标。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-icon.png)
正确打开调试窗口后，显示如下：
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-window.png)
#### 调试页面
在调试窗口控制台的 Sources （图中指示1） 栏，可以给 js 打断点调试。
在 uniapp:// （图中指示2）下找到需要调试的页面，单击打开 ，在右侧可以看到我们需要调试的内容（图中指示3）。在需要调试的代码行号的位置，点击打上断点（图中指示4）。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-log.png)
之后，在设备上进行操作，进入断点位置，可以方便我们跟踪调试代码。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-breakpoint.png)
Tip
- 不支持非自定义组件模式
- `vue` 和 `nvue` 页面都能打断点调试
- 目前仅支持 `nvue` 页面查看元素，`vue` 页面暂不支持，`Android` 暂不支持查看 `style`
<!-- uni-app的App端没有webview调试（即webkit remote debug）。
- App端提供真机运行的console.log日志输出，运行到真机或模拟器时，会在HBuilderX的控制台输出日志。（如果使用老版的非自定义组件编译模式，无法输出对象，需要把对象转字符串后输出）
- 如果是调App的界面和常规API，推荐编译到H5端，用Chrome调Dom，保存后立即看到结果，调试更方便。并且H5端也支持titleNView的各种复杂设置。
- 如果是调与手机能力有关的JS API，那么 uni 部分的js api可以使用微信开发者工具调试，因为uni-app 的 App端引擎实际上是一个强化的小程序引擎，所以可以使用微信开发者工具进行debug调试、查看Dom和网络和存储。
- 如果是调plus专用的API，目前只能在控制台打log
- 如果是调nvue，可以使用weex的调试工具，[详见](https://weex.apache.org/zh/tools/toolkit.html)
一般推荐的做法是在PC的Chrome下开发测试，基本完成后运行到微信工具测试，最后再上真机运行看兼容性问题。但此时务必注意css兼容性问题，不要使用太新的css，否则在低版本Android上会不兼容。
注意：即使不发布微信小程序、只发布App，也需要安装微信开发者工具。 -->
### 关于 App 的调试debug
自 `HBuilderX 2.0.3+` 版本起开始支持 `App` 端的调试。
#### 打开调试窗口
在 `HBuilderX` 中，正确运行项目： `运行 --> 运行到手机或模拟器 --> 选择设备`，项目启动后，在下方的控制台选择 `debug` 图标。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/debug-icon.png)
正确打开调试窗口后，显示如下：
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-window.png)
#### 调试页面
在调试窗口控制台的 Sources （图中指示1） 栏，可以给 js 打断点调试。
在 uniapp:// （图中指示2）下找到需要调试的页面，单击打开 ，在右侧可以看到我们需要调试的内容（图中指示3）。在需要调试的代码行号的位置，点击打上断点（图中指示4）。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-log.png)
之后，在设备上进行操作，进入断点位置，可以方便我们跟踪调试代码。
![debug](//img-cdn-qiniu.dcloud.net.cn/uniapp/doc/csdndebug-breakpoint.png)
Tip
- debug仅支持自定义组件模式。如果是非自定义组件模式，请在manifest里配置选为自定义组件模式。非自定义组件模式即将停止支持，[详见](https://ask.dcloud.net.cn/article/36385)
- `vue` 和 `nvue` 页面都能打断点调试
- 目前仅支持 `nvue` 页面审查元素，`vue` 页面暂不支持，`Android` 暂不支持查看 `style`
- App端提供真机运行的console.log日志输出，运行到真机或模拟器时，不用点debug按钮，操作手机，会在HBuilderX的控制台直接输出日志。
- 如果是调试App的界面和常规API，推荐编译到H5端，点HBuilderX右上角的预览，在内置浏览器里调Dom，保存后立即看到结果，调试更方便。并且H5端也支持titleNView的各种复杂设置。唯一要注意的就是css兼容性，使用太新的css在pc上预览可能正常，但低端Android上异常，具体可查询caniuse等网站。
- 常用的开发模式就是pc上使用内置浏览器预览调dom，运行到真机上看console.log。如果是很复杂的问题才使用debug。
- vue页面也可以在微信开发者工具里调试，除了plus API，其他是一样的，微信开发者工具的查看Dom和网络和存储等调试工具相对而言更完善些。
注意：即使不发布微信小程序、只发布App，也需要安装微信开发者工具。
- uni-app的App端没有5+App那种webkit remote debug
### 持续集成
......@@ -162,4 +157,4 @@ Tip
HBuilderX版与cli版互转指南参考：[https://ask.dcloud.net.cn/article/35750](https://ask.dcloud.net.cn/article/35750)
如果是发布App，则需要使用[离线打包](https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/508)，配置原生环境，来实现持续集成。（目前HBuilderX还不支持命令行生成wgt资源和云打包，欢迎到需求墙投票：[https://dev.dcloud.net.cn/wish/](https://dev.dcloud.net.cn/wish/)）
\ No newline at end of file
如果是发布App，则需要使用[离线打包](https://ask.dcloud.net.cn/docs/#//ask.dcloud.net.cn/article/508)，配置原生环境，来实现持续集成。（目前HBuilderX还不支持命令行生成wgt资源和云打包，欢迎到需求墙投票：[https://dev.dcloud.net.cn/wish/](https://dev.dcloud.net.cn/wish/)）
docs/use-weex.md
浏览文件 @ f51b016b
......@@ -18,7 +18,7 @@
- 前端控件无法覆盖原生控件的问题。在nvue下，都是原生控件，覆盖map、video等不需要cover-view（如需要发布到小程序，仍然推荐写cover-view）
- 同样因为层级问题得到解决，nvue可以实现video内嵌到swiper中，以实现抖音式视频滑动切换，例子见[插件市场](https://ext.dcloud.net.cn/plugin?id=664)；nvue的视频全屏后，仍然可以通过cover-view实现内容覆盖，比如增加文字标题、分享按钮。
- nvue下有live-pusher组件，和小程序对齐。而vue页面下使用直播，需在条件编译里单独调用plus.video的API。
- nvue下的map组件，小程序对齐。而vue页面的map组件有一些差异。
- App端nvue文件的map和小程序拉齐度更高。vue里的map则与plus.map功能一致，和小程序的地图略有差异。
- App端实现粘性布局，比如滚动吸顶，则nvue才能保证高性能，例子见[插件市场](https://ext.dcloud.net.cn/plugin?id=715)
此外，App端，vue页面上也可以覆盖subnvue（一种非全屏的nvue页面覆盖在webview上），以解决App上的原生控件层级问题。[详见](https://ask.dcloud.net.cn/article/35948)
......@@ -96,11 +96,11 @@ uni-app 深度改进了 weex，提供了2种编译模式，一种是常规的 we
### 2. 开发 nvue 页面
``nvue`` 页面结构同 ``vue``, 由 template、style、script 构成。
* template： 模板写法、数据绑定同 ``vue``。组件支持2种模式，1、 ``weex`` 组件，参考：[weex 内置组件](https://weex.apache.org/zh/docs/components/a.html)；2、``uni-app``组件，参考：[nvue中支持的uni-app组件](https://ask.dcloud.net.cn/article/36074)
* template： 模板写法、数据绑定同 ``vue``。组件支持2种模式，1、 ``weex`` 组件，同weex写法，参考：[weex 内置组件](https://weex.apache.org/zh/docs/components/a.html)；2、``uni-app``组件，同uni-app写法。部分组件还未在nvue下实现，具体见：[nvue中还未支持的uni-app组件](https://ask.dcloud.net.cn/article/36074)
* style：由于采用原生渲染，**并非所有浏览器的 css 均支持，布局模型只支持 flex 布局**，虽然不会造成某些界面布局无法实现，但写法要注意。详见：[weex 样式](https://weex.apache.org/cn/wiki/common-styles.html)
* script：写法同 ``vue``，并支持3种API
- weex API ：使用前需先引入对应模块，参考：[weex 内置模块](http://weex-project.io/cn/references/modules/index.html)
- uni API：nvue可以使用部分 uni API，详细支持列表请参照：[nvue 里可使用的 uni-app API](/use-weex?id=nvue-里可使用的-uni-app-api)
* script：写法同 ``vue``，并支持3种API：
- weex API ：使用前需先引入对应模块，参考：[weex 模块引入](https://weex.apache.org/zh/docs/api/weex-variable.html#requiremodule)
- uni API：nvue可以使用大部分 uni API，个别API不支持，不支持列表请参照：[nvue 里还未支持的 uni-app API](/use-weex?id=nvue-里可使用的-uni-app-api)
- plus API：在自定义组件编译模式下，nvue里可直接使用plus API
......@@ -148,9 +148,9 @@ uni-app 深度改进了 weex，提供了2种编译模式，一种是常规的 we
HBuilderX内置了更好用的weex/uni-app调试工具，包括审查界面元素、看log、debug打断点，[详见](https://uniapp.dcloud.io/snippet?id=%e5%85%b3%e4%ba%8e-app-%e7%9a%84%e8%b0%83%e8%af%95)
## 生命周期
## weex 生命周期
``nvue `` 的 uni-app 编译模式的生命周期同普通vue页面。而 weex 编译模式，即普通 weex 生命周期函数如下：
``nvue `` 的 uni-app 编译模式的生命周期同普通vue页面，[参考](https://uniapp.dcloud.io/collocation/frame/lifecycle)。而 weex 编译模式，生命周期函数同weex，具体如下：
|Vue 生命周期钩子|说明|
|---|---|
......@@ -292,13 +292,25 @@ globalEvent.addEventListener("plusMessage", e => {
## vue 和 nvue 共享的变量和数据
除了通信事件，vue 和 nvue 页面之间还可以共享变量和存储。
但注意nvue不支持vuex，uni-app提供的共享变量和数据的方案如下：
uni-app提供的共享变量和数据的方案如下：
**1. vuex:**
自```HBuilderX 2.2.5-alpha```起，nvue支持vuex
**注意：**
- 不支持直接引入`store`使用，可以使用`mapState`、`mapGetters`、`mapMutations`等辅助方法或者使用`this.$store`
- 暂时只支持`uni-app`编译模式，不支持`weex`编译模式
- `renderer:native`时也可以使用`vuex`
**2. uni.storage:**
1. uni.storage
vue和nvue页面可以使用相同的`uni.storage`存储。这个存储是持久化的。
比如登陆状态可以保存在这里。
2. globalData
**3. globalData:**
小程序有globalData机制，这套机制在uni-app里也可以使用，全端通用。
在`App.vue`文件里定义globalData，如下：
```html
......@@ -583,27 +595,9 @@ App.vue
</script>
```
## nvue 里可使用的 uni-app API
## nvue 里不支持的 uni-app API
`nvue` 支持大部分 uni-app API ，下面只列举目前还不支持的 API 。
**地图**
|API|说明|
|:-|:-|
|uni.createMapContext()|创建并返回 map 上下文|
**视频**
|API|说明|
|:-|:-|
|uni.createVideoContext()|创建并返回 video 上下文|
**直播推流**
|API|说明|
|:-|:-|
|uni.createLivePusherContext()|创建并返回 livePusher 上下文|
**动画**
|API|说明|
......@@ -618,20 +612,7 @@ App.vue
**绘画**
|API|说明|
|:-|:-|
|uni.createCanvasContext()|创建 canvas 绘图上下文|
|uni.canvasToTempFilePath()|把当前画布指定区域的内容导出生成指定大小的图片，并返回文件路径|
|uni.canvasGetImageData()|返回一个数组，用来描述 canvas 区域隐含的像素数据|
|uni.canvasPutImageData()|将像素数据绘制到画布的方法|
**下拉刷新**
|API|说明|
|:-|:-|
|uni.onPullDownRefresh()|监听该页面用户下拉刷新事件|
|uni.startPullDownRefresh()|开始下拉刷新|
|uni.stopPullDownRefresh()|停止当前页面下拉刷新|
canvas API使用，详见canvas文档。
**节点信息**
......@@ -756,8 +737,7 @@ export default {
- 现阶段 nvue 的定位是 vue 的补充。在 App 平台实现一些 vue 上无法实现或性能有问题的场景。
- nvue 的各组件在安卓端默认是透明的，如果不设置background-color，可能会导致出现重影的问题。
- 在 App.vue 中定义的全局js变量不会在 nvue 页面生效。globalData是生效的。
- nvue 不支持 vue 里的 vuex
- nvue 切换横竖屏时可能导致样式出现问题，建议有 nvue 的页面锁定手机方向。
- 不能在 style 中引入字体文件，nvue 中字体图标的使用参考：[weex 加载自定义字体](https://weex.apache.org/zh/docs/modules/dom.html#addrule)。
- 不能在 style 中引入字体文件，nvue 中字体图标的使用参考：[weex 加载自定义字体](https://weex.apache.org/zh/docs/modules/dom.html#addrule)。如果是本地字体，可以用plus.io的API转换路径。
- 目前不支持在 nvue 页面使用 typescript/ts。
- nvue 页面 ``titleNview`` 设为 ``false``时，想要模拟状态栏，可以参考：[https://ask.dcloud.net.cn/article/35111](https://ask.dcloud.net.cn/article/35111)。
docs/use.md
浏览文件 @ f51b016b
......@@ -389,7 +389,10 @@ export default {
```uni-app``` 支持配置全局组件，需在 ``main.js`` 里进行全局注册，注册后就可在所有页面里使用该组件。
**注意**：``Vue.component`` 的第一个参数必须是静态的字符串。
**注意**
- ``Vue.component`` 的第一个参数必须是静态的字符串。
- nvue页面暂不支持全局组件
**示例**
......
packages/uni-app-plus-nvue/dist/index.js
浏览文件 @ f51b016b
......@@ -101,10 +101,6 @@ var serviceContext = (function () {
var base64Arraybuffer_1 = base64Arraybuffer.encode;
var base64Arraybuffer_2 = base64Arraybuffer.decode;
function pack (args) {
return args
}
function unpack (args) {
return args
}
......@@ -4387,7 +4383,7 @@ var serviceContext = (function () {
/**
* 执行蓝牙相关方法
*/
function bluetoothExec (method, callbackId, data = {}) {
function bluetoothExec (method, callbackId, data = {}, beforeSuccess) {
var deviceId = data.deviceId;
if (deviceId) {
data.deviceId = deviceId.toUpperCase();
......@@ -4399,7 +4395,10 @@ var serviceContext = (function () {
plus.bluetooth[method.replace('Changed', 'Change')](Object.assign(data, {
success (data) {
invoke(callbackId, Object.assign({}, pack(data), {
if (typeof beforeSuccess === 'function') {
beforeSuccess(data);
}
invoke(callbackId, Object.assign({}, data, {
errMsg: `${method}:ok`,
code: undefined,
message: undefined
......@@ -4416,9 +4415,12 @@ var serviceContext = (function () {
/**
* 监听蓝牙相关事件
*/
function bluetoothOn (method) {
function bluetoothOn (method, beforeSuccess) {
plus.bluetooth[method.replace('Changed', 'Change')](function (data) {
publish(method, Object.assign({}, pack(data), {
if (typeof beforeSuccess === 'function') {
beforeSuccess(data);
}
publish(method, Object.assign({}, data, {
code: undefined,
message: undefined
}));
......@@ -4426,6 +4428,16 @@ var serviceContext = (function () {
return true
}
function checkDevices (data) {
data.devices = data.devices.map(device => {
var advertisData = device.advertisData;
if (advertisData && typeof advertisData !== 'string') {
device.advertisData = arrayBufferToBase64(advertisData);
}
return device
});
}
var onBluetoothAdapterStateChange;
var onBluetoothDeviceFound;
var onBLEConnectionStateChange;
......@@ -4446,7 +4458,7 @@ var serviceContext = (function () {
}
function startBluetoothDevicesDiscovery (data, callbackId) {
onBluetoothDeviceFound = onBluetoothDeviceFound || bluetoothOn('onBluetoothDeviceFound');
onBluetoothDeviceFound = onBluetoothDeviceFound || bluetoothOn('onBluetoothDeviceFound', checkDevices);
bluetoothExec('startBluetoothDevicesDiscovery', callbackId, data);
}
......@@ -4455,7 +4467,7 @@ var serviceContext = (function () {
}
function getBluetoothDevices (data, callbackId) {
bluetoothExec('getBluetoothDevices', callbackId, {});
bluetoothExec('getBluetoothDevices', callbackId, {}, checkDevices);
}
function getConnectedBluetoothDevices (data, callbackId) {
......@@ -4481,12 +4493,18 @@ var serviceContext = (function () {
}
function notifyBLECharacteristicValueChange (data, callbackId) {
onBLECharacteristicValueChange = onBLECharacteristicValueChange || bluetoothOn('onBLECharacteristicValueChange');
onBLECharacteristicValueChange = onBLECharacteristicValueChange || bluetoothOn('onBLECharacteristicValueChange',
data => {
data.value = arrayBufferToBase64(data.value);
});
bluetoothExec('notifyBLECharacteristicValueChange', callbackId, data);
}
function notifyBLECharacteristicValueChanged (data, callbackId) {
onBLECharacteristicValueChange = onBLECharacteristicValueChange || bluetoothOn('onBLECharacteristicValueChange');
onBLECharacteristicValueChange = onBLECharacteristicValueChange || bluetoothOn('onBLECharacteristicValueChange',
data => {
data.value = arrayBufferToBase64(data.value);
});
bluetoothExec('notifyBLECharacteristicValueChanged', callbackId, data);
}
......@@ -4495,7 +4513,8 @@ var serviceContext = (function () {
}
function writeBLECharacteristicValue (data, callbackId) {
bluetoothExec('writeBLECharacteristicValue', callbackId, unpack(data));
data.value = base64ToArrayBuffer(data.value);
bluetoothExec('writeBLECharacteristicValue', callbackId, data);
}
function getScreenBrightness () {
......
packages/webpack-uni-pages-loader/lib/platforms/app-plus/index.js
浏览文件 @ f51b016b
......@@ -394,6 +394,10 @@ module.exports = function (pagesJson, userManifestJson) {
}
}
if (!process.env.UNI_USING_COMPONENTS) {
manifestJson.plus.launchwebview.kernel = 'UIWebview'
}
manifest.content = manifestJson
// 分包合并
......
src/core/view/bridge/subscribe/index.js
浏览文件 @ f51b016b
......@@ -39,7 +39,7 @@ function updateCssVar (vm) {
}
}
export default function initSubscribe (subscribe) {
export default function initSubscribe (subscribe) {
Object.keys(subscribeApis).forEach(name => {
subscribe(name, subscribeApis[name])
})
......@@ -88,10 +88,10 @@ export default function initSubscribe (subscribe) {
onReachBottomDistance,
enableTransparentTitleNView
})
setTimeout(function () { // 避免监听太早，直接触发了 scroll
requestAnimationFrame(function () { // 避免监听太早，直接触发了 scroll
document.addEventListener('scroll', scrollListener)
}, 10)
})
}
})
}
}
}
src/core/view/bridge/subscribe/scroll.js
浏览文件 @ f51b016b
......@@ -91,6 +91,10 @@ export function createScrollListener (pageId, {
}
function trigger () {
const pages = getCurrentPages()
if (!pages.length || pages[pages.length - 1].$page.id !== pageId) {
return
}
// publish
const scrollTop = window.pageYOffset
if (enablePageScroll) { // 向 Service 发送 onPageScroll 事件
......@@ -121,4 +125,4 @@ export function createScrollListener (pageId, {
}
ticking = true
}
}
}
src/platforms/app-plus/service/api/network/request.js
浏览文件 @ f51b016b
......@@ -17,7 +17,8 @@ export function createRequestTaskById (requestTaskId, {
data,
header,
method = 'GET',
responseType
responseType,
sslVerify = true
} = {}) {
const stream = requireNativePlugin('stream')
const headers = {}
......@@ -57,7 +58,9 @@ export function createRequestTaskById (requestTaskId, {
headers,
type: responseType === 'arraybuffer' ? 'base64' : 'text',
// weex 官方文档未说明实际支持 timeout，单位：ms
timeout: timeout || 6e5
timeout: timeout || 6e5,
// 配置和weex模块内相反
sslVerify: !sslVerify
}
if (method !== 'GET') {
options.body = data
......
src/platforms/mp-toutiao/runtime/api/protocols.js
浏览文件 @ f51b016b
......@@ -2,21 +2,16 @@ import previewImage from '../../../mp-weixin/helpers/normalize-preview-image'
// 不支持的 API 列表
const todos = [
'getBackgroundAudioManager',
'createCameraContext',
'createLivePlayerContext',
'getSavedFileInfo',
'openDocument',
'chooseLocation',
'createMapContext',
'canIUse',
'onMemoryWarning',
'onGyroscopeChange',
'startGyroscope',
'stopGyroscope',
'setScreenBrightness',
'getScreenBrightness',
'onUserCaptureScreen',
'addPhoneContact',
'openBluetoothAdapter',
'startBluetoothDevicesDiscovery',
......@@ -55,8 +50,6 @@ const todos = [
'setBackgroundColor',
'setBackgroundTextStyle',
'chooseInvoiceTitle',
'navigateToMiniProgram',
'navigateBackMiniProgram',
'addTemplate',
'deleteTemplate',
'getTemplateLibraryById',
......@@ -66,13 +59,12 @@ const todos = [
'setEnableDebug',
'onWindowResize',
'offWindowResize',
'compressImage',
'createOffscreenCanvas',
'vibrate'
]
// 存在兼容性的 API 列表
// 头条小程序不支持canIUses
// 头条小程序自1.35.0+支持canIUses
const canIUses = [
// 'createIntersectionObserver',
// 'getSavedFileList',
......@@ -88,6 +80,13 @@ const canIUses = [
// 'onSocketClose',
// 'getExtConfig',
// 'getExtConfigSync',
// 'navigateToMiniProgram',
// 'navigateBackMiniProgram',
// 'compressImage',
// 'chooseLocation',
// 'openDocument',
// 'onUserCaptureScreen',
// 'getBackgroundAudioManager',
]
// 需要做转换的 API 列表
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或