Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
yangkaifeng
uni-app
提交
99ca49fb
U
uni-app
项目概览
yangkaifeng
/
uni-app
与 Fork 源项目一致
Fork自
DCloud / uni-app
通知
3
Star
1
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
1
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
U
uni-app
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
1
Issue
1
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
99ca49fb
编写于
12月 25, 2019
作者:
Q
qiang
浏览文件
操作
浏览文件
下载
差异文件
Merge branch 'zhangjialegh-fix/choose-video' into dev
上级
31e0a78b
2cc6d303
变更
25
展开全部
隐藏空白更改
内联
并排
Showing
25 changed file
with
300 addition
and
172 deletion
+300
-172
README.md
README.md
+2
-2
docs/README.md
docs/README.md
+4
-4
docs/api/location/location.md
docs/api/location/location.md
+1
-1
docs/api/location/open-location.md
docs/api/location/open-location.md
+1
-1
docs/api/media/image.md
docs/api/media/image.md
+3
-2
docs/api/media/video-context.md
docs/api/media/video-context.md
+1
-1
docs/api/storage/storage.md
docs/api/storage/storage.md
+6
-4
docs/api/ui/navigationbar.md
docs/api/ui/navigationbar.md
+31
-0
docs/api/ui/prompt.md
docs/api/ui/prompt.md
+11
-11
docs/case.md
docs/case.md
+10
-4
docs/collocation/App.md
docs/collocation/App.md
+26
-21
docs/collocation/main.md
docs/collocation/main.md
+7
-5
docs/collocation/manifest.md
docs/collocation/manifest.md
+33
-2
docs/component/input.md
docs/component/input.md
+2
-1
docs/component/list.md
docs/component/list.md
+1
-1
docs/component/native-component.md
docs/component/native-component.md
+25
-11
docs/component/navigator.md
docs/component/navigator.md
+5
-2
docs/component/picker.md
docs/component/picker.md
+1
-1
docs/component/progress.md
docs/component/progress.md
+6
-3
docs/component/rich-text.md
docs/component/rich-text.md
+5
-3
docs/component/video.md
docs/component/video.md
+2
-2
docs/ecosystem.md
docs/ecosystem.md
+1
-1
docs/release.md
docs/release.md
+106
-76
docs/select.md
docs/select.md
+9
-12
src/platforms/h5/service/api/media/choose-video.js
src/platforms/h5/service/api/media/choose-video.js
+1
-1
未找到文件。
README.md
浏览文件 @
99ca49fb
...
...
@@ -6,9 +6,9 @@
# uni-app的特点
-
开发者和案例更多:HBuilder装机量380万台,开发者社区月活百万,70多个QQ微信群承载10万人。案例众多(
[
详见
](
https://uniapp.dcloud.io/case
)
)
-
开发者和案例更多:HBuilder装机量380万台,开发者社区月活百万,70多个QQ微信群承载10万人。案例众多
,uni统计月活2亿+
(
[
详见
](
https://uniapp.dcloud.io/case
)
)
-
性能更高(见
[
评测
](
https://juejin.im/post/5ca1736af265da30ae314248
)
)
-
更丰富的周边生态(见
[
插件市场
](
https://ext.dcloud.net.cn/
)
近
千款插件)
-
更丰富的周边生态(见
[
插件市场
](
https://ext.dcloud.net.cn/
)
数
千款插件)
-
提供比小程序原生开发更好的开发体验和更高的工程化效率
-
跨端抹平度更完善,且各端特色发挥更灵活,可真正实现一套代码多端覆盖,无需各端多头维护升级
-
权威认可:被阿里小程序官方工具内置(
[
详见
](
https://docs.alipay.com/mini/ide/0.70-stable
)
)
...
...
docs/README.md
浏览文件 @
99ca49fb
```
uni-app``` 是一个使用 [Vue.js](https://vuejs.org/) 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台。
即使不跨端,```uni-app```同时也是更好的小程序开发框架。详见[评测](https://ask.dcloud.net.cn/article/35947)
`DCloud`公司拥有380万开发者,几十万应用案例、8.5亿手机端用户,数千款uni-app插件、70+微信/qq群。阿里小程序工具官方内置uni-app([详见](https://docs.alipay.com/mini/ide/0.70-stable)),腾讯课堂官方为uni-app录制培训课程([详见](https://ask.dcloud.net.cn/article/35640)),开发者可以放心选择。
`
DCloud`公司拥有380万开发者,几十万应用案例、近千款插件、70+微信/qq群,并且被阿里小程序工具内置([详见](https://docs.alipay.com/mini/ide/0.70-stable)),开发者可以放心选择
。
`
uni-app`在手,做啥都不愁。即使不跨端,```uni-app```也是更好的小程序开发框架([详见](https://ask.dcloud.net.cn/article/35947))、更好的App跨平台框架、更方便的H5开发框架。不管领导安排什么样的项目,你都可以快速交付,不需要转换开发思维、不需要更改开发习惯
。
<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>
...
...
@@ -74,7 +74,7 @@
</div>
<div class="uniapp-home-content-item-header">
<h5 class="uniapp-home-content-item-title">开发者/案例数量更多</h5>
<p class="uniapp-home-content-item-text">10万+案例、
900+插件
、70+微信/qq群、更高的百度指数</p>
<p class="uniapp-home-content-item-text">10万+案例、
uni统计月活过2亿
、70+微信/qq群、更高的百度指数</p>
<p class="uniapp-home-content-item-text">跨端完善度更高,真正落地的提高生产力</p>
</div>
</div>
...
...
@@ -105,7 +105,7 @@
</div>
<div class="uniapp-home-content-item-header">
<h5 class="uniapp-home-content-item-title">周边生态丰富</h5>
<p class="uniapp-home-content-item-text">
丰富的<a href="https://ext.dcloud.net.cn/?orderBy=WeekDownload">插件市场</a>,各种轮子拿来即用
。</p>
<p class="uniapp-home-content-item-text">
<a href="https://ext.dcloud.net.cn/?orderBy=WeekDownload">插件市场</a>数千款插件
。</p>
<p class="uniapp-home-content-item-text">支持NPM、支持小程序组件和SDK、兼容mpvue组件和项目、兼容weex组件。</p>
<p class="uniapp-home-content-item-text">微信生态的各种sdk可直接用于跨平台App。</p>
</div>
...
...
docs/api/location/location.md
浏览文件 @
99ca49fb
...
...
@@ -113,7 +113,7 @@ uni.chooseLocation({
```
**注意**
-
不同端,使用地图选择时基于的底层地图引擎不一样,如微信小程序和H5是腾讯地图,App和阿里小程序是高德地图,百度小程序是百度地图,详见地图map组件的使用注意事项
-
不同端,使用地图选择时基于的底层地图引擎不一样,如微信小程序和H5是腾讯地图,App和阿里小程序是高德地图
(注意app端不支持百度地图)
,百度小程序是百度地图,详见地图map组件的使用注意事项
-
微信内置浏览器中可使用微信js sdk,
[
详见
](
https://ask.dcloud.net.cn/article/35380
)
-
chooseLocation属于封装型API,开发者若觉得不够灵活,可自行基于原始的map组件进行封装
-
若Android App端位置不准,见上文uni.getLocation的注意事项
docs/api/location/open-location.md
浏览文件 @
99ca49fb
...
...
@@ -46,7 +46,7 @@ uni.getLocation({
-
``<map>``
组件默认为国测局坐标,调用
``uni.getLocation``
返回结果传递给
``<map>``
组件时,需指定 type 为 gcj02。
-
App 端使用地图组件需要向高德等三方服务商申请SDK资质,获取AppKey,打包时需要在manifest的SDK配置中填写Appkey。在manifest可视化界面有详细申请指南,详见:
[
https://ask.dcloud.net.cn/article/29
](
https://ask.dcloud.net.cn/article/29
)
。
-
iOS端 如需使用第三方地图进行导航,需要在 manifest.json 文件内增加
``urlschemewhitelist``
节点,在线打包即可
-
不同平台打开的地图不一样,App端是高德地图、H5端是腾讯地图、微信小程序端是腾讯地图、百度小程序是百度地图、阿里小程序是高德地图、头条小程序是高德地图。
-
不同平台打开的地图不一样,App端是高德地图
(不支持百度地图)
、H5端是腾讯地图、微信小程序端是腾讯地图、百度小程序是百度地图、阿里小程序是高德地图、头条小程序是高德地图。
```
json
{
...
...
docs/api/media/image.md
浏览文件 @
99ca49fb
...
...
@@ -18,7 +18,8 @@ App端如需要更丰富的相机拍照API(如直接调用前置摄像头)
**Tips**
-
count 值在 H5 平台的表现,基于浏览器本身的规范。目前测试的结果来看,只能限制单选/多选,并不能限制数量。并且,在实际的手机浏览器很少有能够支持多选的。
-
count 值在 H5 平台的表现,基于浏览器本身的规范。目前测试的结果来看,只能限制单选/多选,并不能限制数量。并且,在实际的手机浏览器很少有能够支持多选的。
-
sourceType 在H5端对应
`input`
的
`capture`
属性,设置为
`['album']`
无效,依然可以使用相机。
-
可以通过用户授权API来判断用户是否给应用授予相册或摄像头的访问权限
[
https://uniapp.dcloud.io/api/other/authorize
](
https://uniapp.dcloud.io/api/other/authorize
)
**注:文件的临时路径,在应用本次启动期间可以正常使用,如需持久保存,需在主动调用 [uni.saveFile](api/file/file?id=savefile),在应用下次启动时才能访问得到。**
...
...
@@ -241,7 +242,7 @@ uni.chooseImage({
|5+App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序
|:-:|:-:|:-:|:-:|:-:|:-:|
|1.9.7+
[
自定义组件编译模式
](
https://ask.dcloud.net.cn/article/35843
)
|x|√|√|
x
|√|
|1.9.7+
[
自定义组件编译模式
](
https://ask.dcloud.net.cn/article/35843
)
|x|√|√|
√(基础库版本>=3.110.3)
|√|
**OBJECT 参数说明**
...
...
docs/api/media/video-context.md
浏览文件 @
99ca49fb
...
...
@@ -5,7 +5,7 @@
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|
x
|√|√|√|
|√|√|√|
基础库版本>=1.10.0
|√|√|√|
**videoContext 对象的方法列表**
...
...
docs/api/storage/storage.md
浏览文件 @
99ca49fb
...
...
@@ -97,7 +97,7 @@ try {
**平台差异说明**
|
5+
App|H5|微信小程序|支付宝小程序|百度小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|
|:-:|:-:|:-:|:-:|:-:|
|HBuilderX 2.0.3+|√|√|√|√|
...
...
@@ -134,7 +134,7 @@ uni.getStorageInfo({
**平台差异说明**
|
5+
App|H5|微信小程序|支付宝小程序|百度小程序|
|App|H5|微信小程序|支付宝小程序|百度小程序|
|:-:|:-:|:-:|:-:|:-:|
|HBuilderX 2.0.3+|√|√|√|√|
...
...
@@ -219,10 +219,12 @@ try {
uni-app的Storage在不同端的实现不同:
-
H5端为localStorage,浏览器限制5M大小,是缓存概念,可能会被清理
-
App端为原生的plus.storage,无大小限制,不是缓存,
持久化
-
App端为原生的plus.storage,无大小限制,不是缓存,
是持久化的
-
各个小程序端为其自带的storage api,数据存储生命周期跟小程序本身一致,即除用户主动删除或超过一定时间被自动清理,否则数据都一直可用。
-
微信小程序单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB。
-
支付宝小程序单条数据转换成字符串后,字符串长度最大200
*
1024。同一个支付宝用户,同一个小程序缓存总上限为10MB。
-
百度、头条小程序文档未说明大小限制
除此之外,H5端还支持websql、indexedDB、sessionStorage;App端还支持
[
SQLite
](
https://www.html5plus.org/doc/zh_cn/sqlite.html
)
、
[
IO文件
](
https://www.html5plus.org/doc/zh_cn/io.html
)
等本地存储方案。
除此之外,其他数据存储方案:
-
H5端还支持websql、indexedDB、sessionStorage
-
App端还支持
[
SQLite
](
https://www.html5plus.org/doc/zh_cn/sqlite.html
)
、
[
IO文件
](
https://www.html5plus.org/doc/zh_cn/io.html
)
等本地存储方案。
docs/api/ui/navigationbar.md
浏览文件 @
99ca49fb
...
...
@@ -130,3 +130,34 @@ App平台调用此API时会关闭屏幕中间悬浮显示的loading
```
javascript
uni
.
hideNavigationBarLoading
()
```
### uni.hideHomeButton(OBJECT)
在当前页面隐藏导航条加载动画。
**平台差异说明**
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|x|x|x|
隐藏返回首页按钮。
**OBJECT参数说明**
|参数|类型|必填|说明|
|---|---|---|---|
|success|Function|否|接口调用成功的回调函数|
|fail|Function|否|接口调用失败的回调函数|
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|
**示例**
```
javascript
uni
.
hideHomeButton
()
```
**说明**
-
微信小程序自基础库版本2.8.3开始支持
-
当用户打开的小程序最底层页面是非首页时,默认展示“返回首页”按钮,开发者可在页面
`onShow`
中调用
`hideHomeButton`
进行隐藏。
\ No newline at end of file
docs/api/ui/prompt.md
浏览文件 @
99ca49fb
...
...
@@ -8,10 +8,10 @@
|:-|:-|:-|:-|:-|:-|
|title|String|是|提示的内容,长度与 icon 取值有关。||
|icon|String|否|图标,有效值详见下方说明。||
|image|String|否|自定义图标的本地路径|
5+
App、H5、微信小程序、百度小程序|
|mask|Boolean|否|是否显示透明蒙层,防止触摸穿透,默认:false|
5+
App、微信小程序|
|duration|Number|否|提示的延迟时间,单位毫秒,默认:1500||
|position|String|否|纯文本轻提示显示位置,填写有效值后只有
`title`
属性生效, 有效值详见下方说明。|
5+
App|
|image|String|否|自定义图标的本地路径|App、H5、微信小程序、百度小程序|
|mask|Boolean|否|是否显示透明蒙层,防止触摸穿透,默认:false|App、微信小程序|
|duration|Number|否|提示的延迟时间,单位毫秒,默认:1500||
|position|String|否|纯文本轻提示显示位置,填写有效值后只有
`title`
属性生效, 有效值详见下方说明。|App|
|success|Function|否|接口调用成功的回调函数||
|fail|Function|否|接口调用失败的回调函数||
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|
|
...
...
@@ -22,7 +22,7 @@
|:-|:-|:-|
|success|显示成功图标,此时 title 文本最多显示 7 个汉字长度。默认值||
|loading|显示加载图标,此时 title 文本最多显示 7 个汉字长度。|支付宝小程序不支持|
|none|不显示图标,此时 title 文本在
`小程序`
最多可显示两行,
`
5+
App`
仅支持单行显示。|
|
|none|不显示图标,此时 title 文本在
`小程序`
最多可显示两行,
`App`
仅支持单行显示。|
|
**示例**
...
...
@@ -32,14 +32,14 @@ uni.showToast({
duration
:
2000
});
```
**position 值说明**
**position 值说明
(仅App生效)
**
|值|说明|
|:-|:-|
|top|居上显示|
|center|居中显示|
|bottom|居底显示|
|bottom|居底显示|
**Tips**
...
...
@@ -65,7 +65,7 @@ uni.hideToast();
|参数|类型|必填|说明|平台差异说明|
|:-|:-|:-|:-|:-|
|title|String|是|提示的内容||
|mask|Boolean|否|是否显示透明蒙层,防止触摸穿透,默认:false|
5+
App、微信小程序、百度小程序|
|mask|Boolean|否|是否显示透明蒙层,防止触摸穿透,默认:false|App、微信小程序、百度小程序|
|success|Function|否|接口调用成功的回调函数||
|fail|Function|否|接口调用失败的回调函数||
|complete|Function|否|接口调用结束的回调函数(调用成功、失败都会执行)|
|
...
...
@@ -181,5 +181,5 @@ App端实现原生的、复杂的底部图文菜单,例如分享菜单,可
**注意**
-
本章的所有弹出控件都是原生控件,层级最高,可覆盖video、map、tabbar等原生控件。
-
[
uni-app插件市场
](
https://ext.dcloud.net.cn/
)
有很多封装好的前端组件,但注意前端组件层级不是最高,无法覆盖原生组件。
-
App端还有原生的
[
prompt API
](
https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.prompt
)
\ No newline at end of file
-
[
uni-app插件市场
](
https://ext.dcloud.net.cn/
)
有很多封装好的前端组件,但注意前端组件层级不是最高,无法覆盖原生组件,除非使用cover-view或nvue。
-
App端还有原生的
[
prompt API
](
https://www.html5plus.org/doc/zh_cn/nativeui.html#plus.nativeUI.prompt
)
docs/case.md
浏览文件 @
99ca49fb
如关心App端案例,注意uni-app编译到App时,其实是使用了DCloud的5+App引擎,该引擎拥有众多案例(包括中国工商总局、公安部、中国邮政、湖北银行、360等),有3亿手机用户在使用基于5+引擎开发的应用。详见
[
https://dcloud.io/case/
](
https://dcloud.io/case/
)
uni-app已经有几十万开发者,是开发者数量和案例最丰富的多端开发框架。
我们相信还有更多优秀案例,没有被我们采集到,欢迎大家到
[
项目案例征集
](
https://github.com/dcloudio/uni-app/issues/6
)
提交。
uni-app已经有几十万开发者,
uni统计月活2亿,
是开发者数量和案例最丰富的多端开发框架。
欢迎知名开发商提交案例或接入uni统计,越多人加入uni-app生态,这个生态会发展的更好,
[
项目案例征集
](
https://github.com/dcloudio/uni-app/issues/6
)
提交。
### 官方示例
...
...
@@ -17,7 +17,7 @@ uni-app已经有几十万开发者,是开发者数量和案例最丰富的多
</a>
</div>
<a
href=
"//m3w.cn/__uni__1e99193"
target=
"_blank"
class=
"clear-style"
><b>
新闻/资讯类App模板:
</b></a>
nvue 典型案例,App端纯原生渲染,可左右拖动的复杂长列表,满足苛刻的性能要求。并同时能编译为小程序和H5。本项目源码在HBuilderX中新建项目
可获得,并可进一步运行到各端小程序
。
<a
href=
"//m3w.cn/__uni__1e99193"
target=
"_blank"
class=
"clear-style"
><b>
新闻/资讯类App模板:
</b></a>
nvue 典型案例,App端纯原生渲染,可左右拖动的复杂长列表,满足苛刻的性能要求。并同时能编译为小程序和H5。本项目源码在HBuilderX中新建项目
选新闻模块可获得
。
<div
style=
"display:flex;justify-content: space-around;"
>
<a
href=
"//m3w.cn/__uni__1e99193"
target=
"_blank"
class=
"clear-style barcode-view"
>
<img
src=
"//img.cdn.aliyun.dcloud.net.cn/stream/qr/__UNI__1E99193.png/256"
width=
"200"
/>
...
...
@@ -151,6 +151,8 @@ uni-app已经有几十万开发者,是开发者数量和案例最丰富的多
**张亮麻辣烫:**
百度小程序搜索 “张亮麻辣烫”
**西祠胡同:**
[
App及H5版
](
https://www.xici.net/
)
**上铁12306:**
[
Android
](
https://android.myapp.com/myapp/detail.htm?apkName=com.shentie.app
)
、
[
iOS
](
https://apps.apple.com/cn/app/shang-tie12306/id1080296082
)
**浙江移动境外出行指南:**
[
H5
](
https://wap.zj.10086.cn/szhy/business/20190610gmh5/#/
)
...
...
@@ -169,11 +171,13 @@ uni-app已经有几十万开发者,是开发者数量和案例最丰富的多
**拉卡拉收款宝:**
App部分页面使用uni-app制作
**汕头公交:**
广东移动出品。
[
Android
](
https://android.myapp.com/myapp/detail.htm?apkName=com.gmcc.stgj
)
、
[
iOS
](
https://apps.apple.com/cn/app/%E6%B1%95%E5%A4%B4%E5%85%AC%E4%BA%A4/id1091442840
)
、微信小程序搜索“汕头智慧公交”
**香橙:**
餐馆SaaS服务,手机点餐、下单、排队叫号、营销推广。
[
官网
](
http://ivcvc.com
)
**围棋战场:**
围棋对弈,游戏类的小程序(非小游戏)。
[
微信小程序码
](
https://user-images.githubusercontent.com/16237216/65005363-327a9f80-d932-11e9-9be6-68cdbcdfdbf1.png
)
**波比英语课堂:**
幼儿英语启蒙
神器
培养国际宝宝。
[
App、小程序通用链接
](
http://m3w.cn/bbyykt
)
**波比英语课堂:**
幼儿英语启蒙
,
培养国际宝宝。
[
App、小程序通用链接
](
http://m3w.cn/bbyykt
)
**桂聘:**
广西区域招聘。
[
Android和iOS
](
http://www.guipin.com/jihui/
)
...
...
@@ -243,6 +247,8 @@ uni-app已经有几十万开发者,是开发者数量和案例最丰富的多
**同济医院官方App:**
[
iOS和Android下载页
](
https://tjhapp.com.cn/app/appdown.html
)
**碧桂园:**
凤凰云
[
h5
](
https://fhyhub.bgy.com.cn/h5/activity/#/
)
<!-- **湖州市妇幼保健院:**[H5](http://my.hzfby.com/h5/#/) -->
**随州便民网:**
服务全随州人的便民信息平台。
[
App、小程序通用链接
](
//m3w.cn/szbmw
)
...
...
docs/collocation/App.md
浏览文件 @
99ca49fb
`App.vue`
是
我们的主组件,所有页面都是在
`App.vue`
下进行切换的,是页面入口文件
。
`App.vue`
是
uni-app的主组件,所有页面都是在
`App.vue`
下进行切换的,是页面入口文件。但
`App.vue`
本身不是页面,这里不能编写视图元素
。
在这个文件里,你可以初始化一些通用的组件,调用一些应用生命周期函数。
这个文件的作用包括:调用应用生命周期函数、配置全局样式、配置全局的存储globalData
应用生命周期仅可在
`App.vue`
中监听,在
其它
页面监听无效。
应用生命周期仅可在
`App.vue`
中监听,在页面监听无效。
### 应用生命周期
`uni-app`
支持如下应用生命周期函数:
|函数名 |说明 |
|:- |:- |
|onLaunch |当
`uni-app`
初始化完成时触发(全局只触发一次) |
|onShow |当
`uni-app`
启动,或从后台进入前台显示 |
|onHide |当
`uni-app`
从前台进入后台 |
|onError |当
`uni-app`
报错时触发 |
|onUniNViewMessage|对
`nvue`
页面发送的数据进行监听,可参考
[
nvue 向 vue 通讯
](
/use-weex?id=nvue-向-vue-通讯
)
|
|函数名 |说明 |
平台兼容|
|:- |:- |
:- |
|onLaunch |当
`uni-app`
初始化完成时触发(全局只触发一次) |
|
|onShow |当
`uni-app`
启动,或从后台进入前台显示 |
|
|onHide |当
`uni-app`
从前台进入后台 |
|
|onError |当
`uni-app`
报错时触发 |
|
|onUniNViewMessage|对
`nvue`
页面发送的数据进行监听,可参考
[
nvue 向 vue 通讯
](
/use-weex?id=nvue-向-vue-通讯
)
|
App|
在
`App.vue`
文件里使用生命周期函数,如下:
...
...
@@ -21,13 +21,13 @@
<script>
export
default
{
onLaunch
:
function
()
{
console
.
log
(
'
App Launch
'
)
console
.
log
(
'
App Launch
,app启动
'
)
},
onShow
:
function
()
{
console
.
log
(
'
App Show
'
)
console
.
log
(
'
App Show
,app展现在前台
'
)
},
onHide
:
function
()
{
console
.
log
(
'
App Hide
'
)
console
.
log
(
'
App Hide
,app不再展现在前台
'
)
}
}
</script>
...
...
@@ -39,7 +39,7 @@
-
`App.vue`
不能写模板
### globalData
小程序有globalData
机制,这套机制在uni-app里也可以使用,
全端通用。
小程序有globalData
,这是一种简单的全局变量机制。这套机制在uni-app里也可以使用,并且
全端通用。
**以下是 App.vue 中定义globalData的相关配置:**
...
...
@@ -58,15 +58,20 @@ js中操作globalData的方式如下:
在应用onLaunch时,getApp对象还未获取,暂时可以使用this.$scope.globalData获取globalData。
如果需要把globalData的数据绑定到页面上,可在页面的onShow页面生命周期里进行变量重赋值。
HBuilderX 2.0.3起,nvue页面在
`uni-app`
编译模式下,也支持onShow。
如果需要把globalData的数据绑定到页面上,可在页面的onShow页面生命周期里进行变量重赋值。
weex编译模式中使用globalData的话,由于weex生命周期不支持onShow,但熟悉5+的话,可利用监听webview的addEventListener show事件实现onShow效果,或者直接使用weex生命周期中的beforeCreate。
nvue的weex编译模式中使用globalData的话,由于weex生命周期不支持onShow,但熟悉5+的话,可利用监听webview的addEventListener show事件实现onShow效果,或者直接使用weex生命周期中的beforeCreate。但建议开发者使用uni-app编译模式,而不是weex编译模式。
globalData是简单的全局变量,如果使用状态管理,请使用
`vuex`
(main.js中定义)
### 全局样式
在
`App.vue`
中,可以一些定义全局通用样式,例如需要加一个通用的背景色,首屏页面渲染的动画等都可以写在App.vue中。
**例如:**
现在有个页面背景是深色在vue页面中,可能会发生新窗体刚开始动画时是灰白色背景,动画结束时才变为深色背景,造成闪屏。这种情况就可以使用全局样式来解决。
-
造成这种现象的原因是因为webview的背景生效太慢。此时可将样式写在
`App.vue`
里,来加速页面样式的渲染速度。因为
`App.vue`
里面的样式是全局样式,每次新开页面会优先加载
`App.vue`
里面的样式,然后加载普通 vue 页面的样式去覆盖
`App.vue`
里面的样式。
-
另外nvue页面不存在此问题,也可以更改为nvue页面。
注意如果工程下同时有vue和nvue文件,全局样式的所有css会应用于所有文件,而nvue支持的css有限,编译器会在控制台报警,提示某些css无法在nvue中支持。此时需要把nvue不支持的css写在单独的条件编译里。如:
```
html
<style>
/* #ifndef APP-PLUS-NVUE */
@import
'./common/uni.css'
;
/* #endif*/
</style>
```
docs/collocation/main.md
浏览文件 @
99ca49fb
`main.js`
是
我们的入口文件,主要作用是初始化
`vue`
实例并使用需要的插件
。
`main.js`
是
uni-app的入口文件,主要作用是初始化
`vue`
实例、定义全局组件、使用需要的插件如vuex
。
首先引入了
`Vue`
库和
`App.vue`
,创建了一个
`vue`
实例,并且挂载
`vue`
实例。
```
import Vue from 'vue'
import App from './App'
import pageHead from './components/page-head.vue' //引用page-head组件
import pageHead from './components/page-head.vue' //
全局
引用page-head组件
Vue.config.productionTip = false
Vue.component('page-head', pageHead) //全局注册page-head组件
Vue.component('page-head', pageHead) //全局注册page-head组件
,每个页面将可以直接使用该组件
App.mpType = 'app'
const app = new Vue({
...
...
@@ -15,9 +15,11 @@ const app = new Vue({
})
app.$mount() //挂载Vue实例
```
也可以引用
`vuex`
,
使用
`Vue.use`
引用插件,使用
`Vue.prototype`
添加全局变量,使用
`Vue.component`
注册全局组件。
使用
`Vue.use`
引用插件,使用
`Vue.prototype`
添加全局变量,使用
`Vue.component`
注册全局组件。
不过无法使用
`vue-router`
,路由须在
`pages.json`
中进行配置。
可以引用
`vuex`
,因涉及多个文件,此处没有提供示例,详见
`hello uni-app`
示例工程。
无法使用
`vue-router`
,路由须在
`pages.json`
中进行配置。如果开发者坚持使用
`vue-router`
,可以在
[
插件市场
](
https://ext.dcloud.net.cn/search?q=vue-router
)
找到转换插件。
**注意**
...
...
docs/collocation/manifest.md
浏览文件 @
99ca49fb
...
...
@@ -298,6 +298,7 @@ Tips:关于摇树优化(treeShaking)原理及优化结果,参考:[http
|permission|Object|微信小程序接口权限相关设置,比如申请位置权限必须填此处
[
详见
](
https://developers.weixin.qq.com/miniprogram/dev/framework/config.html
)
|
|workers|String|Worker 代码放置的目录。
[
详见
](
https://developers.weixin.qq.com/miniprogram/dev/framework/workers.html
)
|
|optimization|Object| 对微信小程序的优化配置 |
|cloudfunctionRoot|String| 配置云开发目录,参考
[
setting
](
/collocation/manifest?id=cloudfunctionRoot
)
|
#### setting
...
...
@@ -316,8 +317,38 @@ Tips:关于摇树优化(treeShaking)原理及优化结果,参考:[http
|属性|类型|说明|
|:-|:-|:-|
|subPackages|Boolean|是否开启分包优化|
|subPackages|Boolean|是否开启分包优化|
#### cloudfunctionRoot
如果需要使用微信小程序的云开发,需要在 mp-weixin 配置云开发目录
```
javascript
"
mp-weixin
"
:{
// ...
"
cloudfunctionRoot
"
:
"
cloudfunctions/
"
,
// 配置云开发目录
// ...
}
```
配置目录之后,需要在项目根目录新建
`vue.config.js`
配置对应的文件编译规则
```
javascript
{
plugins
:
[
new
CopyWebpackPlugin
([
{
from
:
path
.
join
(
__dirname
,
'
../cloudfunctions
'
),
to
:
path
.
join
(
__dirname
,
'
unpackage
'
,
'
dist
'
,
process
.
env
.
NODE_ENV
===
'
production
'
?
'
build
'
:
'
dev
'
,
process
.
env
.
UNI_PLATFORM
,
'
cloudfunctions
'
),
},
]),
],
}
```
### mp-alipay
|属性|类型|说明|
...
...
docs/component/input.md
浏览文件 @
99ca49fb
...
...
@@ -46,11 +46,12 @@
-
小程序平台,
`number`
类型只支持输入整型数字。微信开发者工具上体现不出效果,请使用真机预览。
-
如果需要在小程序平台输入浮点型数字,请使用
`digit`
类型。
-
小程序端input在置焦时,会表现为原生控件,此时会层级变高。如需前端组件遮盖input,需让input失焦,或使用cover-view等覆盖原生控件的方案,
[
参考
](
https://uniapp.dcloud.io/component/native-component
)
。具体来讲,阿里小程序的input为text且置焦为原生控件;微信、头条、QQ所有input置焦均为原生控件;百度小程序置焦时仍然是非原生的。也可以参考
[
原生控件
](
https://uniapp.dcloud.io/component/native-component
)
文档
-
input组件若不想弹出软键盘,可设置为disable
-
App平台的vue页面及 H5平台 的弹出键盘使用的是浏览器控制的键盘,丰富程度略低。可通过插件市场找到更多类型的键盘。
-
插件市场有各种类型的模拟键盘,比如车牌键盘、身份证键盘,可去插件市场搜索
[
键盘
](
https://ext.dcloud.net.cn/search?q=%E9%94%AE%E7%9B%98
)
。
-
搜索框ui组件,可参考uni ui的search组件或封装好的页面模板。
[
详见
](
https://ext.dcloud.net.cn/search?q=search
)
-
[
uni-app插件市场
](
https://ext.dcloud.net.cn/
)
有输入文字后自动提示候选的组件,可搜索
[
autocomplete
](
https://ext.dcloud.net.cn/search?q=autocomplete
)
查看。
-
uni-app插件市场
有输入文字后自动提示候选的组件,可搜索
[
autocomplete
](
https://ext.dcloud.net.cn/search?q=autocomplete
)
查看。
**confirm-type 有效值**
...
...
docs/component/list.md
浏览文件 @
99ca49fb
...
...
@@ -4,7 +4,7 @@ app端nvue专用组件。在app-nvue下,如果是长列表,使用list组件
原生渲染的资源回收机制,与webview渲染不同。webview不需要数据有规则格式,长页面处于不可视的部分,其渲染资源会自动回收,除非webview使用区域滚动而不是页面滚动。所以vue页面只要不用scroll-view,就不需要关注这个问题。而原生渲染则必须注意。
如果需要跨端,建议使用uni-ui的uni-list组件,它会自动处理webview渲染和原生渲染的情况,在app-nvue下使用list组件,而在其他平台则使用页面滚动。详见
[
https://ext.dcloud.net.cn/plugin?id=24
](
https://ext.dcloud.net.cn/plugin?id=24
)
**如果需要跨端,建议使用uni-ui的uni-list组件,它会自动处理webview渲染和原生渲染的情况,在app-nvue下使用list组件,而在其他平台则使用页面滚动。详见[https://ext.dcloud.net.cn/plugin?id=24](https://ext.dcloud.net.cn/plugin?id=24)**
`<list>`
组件是提供垂直列表功能的核心组件,拥有平滑的滚动和高效的内存管理,非常适合用于长列表的展示。最简单的使用方法是在
`<list>`
标签内使用一组由简单数组循环生成的
`<cell>`
标签填充。
...
...
docs/component/native-component.md
浏览文件 @
99ca49fb
...
...
@@ -2,7 +2,11 @@
小程序和App的vue页面,主体是webview渲染的。为了提升性能,小程序和App的vue页面下部分ui元素,比如导航栏、tabbar、video、map使用了原生控件。这种方式被称为混合渲染。
虽然提升了性能,但原生组件带来了其他问题:1) 前端组件无法覆盖原生控件的层级问题、2) 原生组件不能嵌入特殊前端组件(如scroll-view)、3) 原生控件无法灵活自定义。
虽然提升了性能,但原生组件带来了其他问题:
1.
前端组件无法覆盖原生控件的层级问题
2.
原生组件不能嵌入特殊前端组件(如scroll-view)
3.
原生控件ui无法灵活自定义
4.
原生控件在Android上,字体会渲染为rom的主题字体,而webview如果不经过单独改造不会使用rom主题字体
H5、App的nvue页面,不存在混合渲染的情况,它们或者全部是前端渲染、或者全部是原生渲染,不涉及层级问题。
...
...
@@ -11,7 +15,7 @@ H5、App的nvue页面,不存在混合渲染的情况,它们或者全部是
*
[
video
](
/component/video
)
*
[
camera
](
/component/camera
)
(仅微信小程序、百度小程序支持)
*
[
canvas
](
/component/canvas
)
(仅在微信小程序、百度小程序表现为原生组件)
*
[
input
](
/component/input
)
(仅在微信小程序、
百度小程序、支付宝小程序、头条小程序中且input置焦时
表现为原生组件)
*
[
input
](
/component/input
)
(仅在微信小程序、
支付宝小程序、头条小程序、QQ小程序中且input置焦时表现为原生组件,其中支付宝小程序的input仅为text且置焦时才
表现为原生组件)
*
[
textarea
](
/component/textarea
)
(仅在微信小程序、百度小程序、头条小程序表现为原生组件)
*
[
live-player
](
/component/live-player
)
(仅微信小程序、百度小程序支持,App端直接使用video组件可同时实现拉流)
*
[
live-pusher
](
/component/live-pusher
)
(仅微信小程序、百度小程序、app-nvue支持,app-vue使用plus.video.LivePusher可实现推流)
...
...
@@ -34,26 +38,27 @@ H5、App的nvue页面,不存在混合渲染的情况,它们或者全部是
#### 其他原生界面元素
除了原生组件外,uni-app在非H5端还有其他原生界面元素,清单如下:
*
原生
导航栏
和tabbar(pages.json里配置的)。
*
原生
navigationBar
和tabbar(pages.json里配置的)。
*
web-view组件虽然不是原生的,但这个组件相当于一个原生webview覆盖在页面上,并且小程序上web-view组件是强制全屏的,无法在上面覆盖前端元素
*
弹出框:picker、showModal、showToast、showLoading、showActionSheet、previewImage、chooseImage、chooseVideo等弹出元素也无法被前端组件覆盖
*
plus下的plus.nativeObj.view、plus.video.LivePusher、plus.nativeUI、plus.webview,层级均高于前端元素
注意:app的nvue页面里的组件虽然不涉及map、video等原生组件的层级遮挡问题,但
上述“其他原生界面元素”
,一样是nvue里的组件也无法遮挡的。
注意:app的nvue页面里的组件虽然不涉及map、video等原生组件的层级遮挡问题,但
pages.json中配置的原生tabbar、原生navigationBar
,一样是nvue里的组件也无法遮挡的。
#### vue页面层级覆盖解决方案
为了解决webview渲染中原生组件层级最高的限制,uni-app提供了
[
cover-view
](
/component/cover-view
)
和
[
cover-image
](
/component/cover-view?id=cover-image
)
组件,让其覆盖在原生组件上。
除了跨端的cover-view,App端还提供了
2种方案:plus.nativeObj.view、subNVue
。详述如下
除了跨端的cover-view,App端还提供了
3种方案:plus.nativeObj.view、subNVue、新开半透明nvue页面
。详述如下
-
[
cover-view
](
https://uniapp.dcloud.io/component/cover-view?id=cover-view
)
`cover-view`
只能覆盖原生组件,不能覆盖其他原生界面元素。比如cover-view可以覆盖video、map,但无法覆盖原生导航栏、tabbar、web-view。
微信小程序在基础库 2.4.0 起已支持 video 组件的同层渲染
。也就是video在非全屏时,可以被前端元素通过调节zindex来遮挡
。但video全屏时,仍需要cover-view覆盖。
微信小程序在基础库 2.4.0 起已支持 video 组件的同层渲染
,2.7.0 起支持 map 组件的同层渲染。可以被前端元素通过调节zindex来遮挡,也支持在scroll-view等组件中内嵌这2个原生组件
。但video全屏时,仍需要cover-view覆盖。
vue页面的
`cover-view`
在App端相比小程序端还有一些限制,1) 无法嵌套、 2) 无法内部滚动,即cover-view无法内部出现滚动条、 3) 无法覆盖到视频的全屏界面。nvue页面的
`cover-view`
无这些限制。
app-vue的
`cover-view`
相比小程序端还有一些限制,1) 无法嵌套、 2) 无法内部滚动,即cover-view无法内部出现滚动条、 3) 无法覆盖到视频的全屏界面。
app-nvue的
`cover-view`
无这些限制。
另外cover-view无论如何都无法解决原生导航栏、tabbar、web-view组件的覆盖,为此App端补充了2个层级覆盖方案plus.nativeObj.view和subNVue
...
...
@@ -73,9 +78,11 @@ subNVue是把weex渲染的原生子窗体,覆盖在vue页面上,它解决了
uni-app支持在App端弹出半透明的nvue窗体。即看起来是在本窗体弹出一个元素,但实际上是弹出了一个部分区域蒙灰透明的新窗体。这样的窗体比subnvue有个优势就是可以全局复用。具体参考这个
[
插件
](
https://ext.dcloud.net.cn/plugin?id=953
)
subNVue或弹出部分区域透明的nvue页面,会比plus.nativeObj.view多占用一些内存。所以如果你要覆盖的内容很简单,cover-view或plus.nativeObj.view可以简单实现
,也
没必要用subNVue或nvue。
subNVue或弹出部分区域透明的nvue页面,会比plus.nativeObj.view多占用一些内存。所以如果你要覆盖的内容很简单,cover-view或plus.nativeObj.view可以简单实现
的话,就
没必要用subNVue或nvue。
所以如果你的层级覆盖问题比较简单,不用嵌套,且有跨端需求,就使用cover-view。
如果App端cover-view无法满足需求,且需要覆盖的原生界面比较简单,可以用plus.nativeObj.view。否则,就使用subnvue或部分区域透明的nvue吧。
**关于subNVue和Webview的层级问题**
subNVue的层级高于前端元素,但多个subNVue以及Webview,它们之间的也存在层级关系。
...
...
@@ -92,7 +99,14 @@ nvue页面全部都是原生组件,互相之间没有层级问题。
如果仅开发App,不跨端,不愿涉及层级问题,也可以不使用pages.json里的原生导航栏和tabbar,nvue页面不需要这些来强化性能。
#### 总结
所以如果你的层级覆盖问题比较简单,不用嵌套,且有跨端需求,就使用cover-view。
#### Android系统主题字体对原生组件渲染的影响
如果App端cover-view无法满足需求,且需要覆盖的原生界面比较简单,可以用plus.nativeObj.view。否则,就使用subnvue或部分区域透明的nvue吧。
在Android手机上,调整系统主题字体,所有原生渲染的控件的字体都会变化,而webview渲染的字体则不会变化。
如果原生渲染和webview渲染出现在同一页面,就会发现字体不一致。
部分小程序通过修改了自带的webview内核,实现了webview也可以使用rom主题字体,比如微信、qq、支付宝;其他小程序及app-vue下,webview仍然无法渲染为rom主题字体。
app端若在意字体不一致的问题,建议直接使用nvue。
不管Android字体问题、还是同层渲染问题,微信小程序都是依靠自带一个几十M的定制webview实现的,这对于App而言增加了太大的体积,不如使用nvue解决这类问题。
docs/component/navigator.md
浏览文件 @
99ca49fb
...
...
@@ -10,11 +10,12 @@
|open-type|String|navigate|跳转方式||
|delta|Number||当 open-type 为 'navigateBack' 时有效,表示回退的层数||
|animation-type|String|pop-in/out|当 open-type 为 navigate、navigateBack 时有效,窗口的显示/关闭动画效果,详见:
[
窗口动画
](
api/router?id=animation
)
|5+App|
|animation-duration|Number|300|当 open-type 为 navigate、navigateBack 时有效,窗口显示/关闭动画的持续时间。|
5+
App|
|animation-duration|Number|300|当 open-type 为 navigate、navigateBack 时有效,窗口显示/关闭动画的持续时间。|App|
|hover-class|String|navigator-hover|指定点击时的样式类,当hover-class="none"时,没有点击态效果||
|hover-stop-propagation|Boolean|false|指定是否阻止本节点的祖先节点出现点击态|微信小程序|
|hover-start-time|Number|50|按住后多久出现点击态,单位毫秒||
|hover-stay-time|Number|600|手指松开后点击态保留时间,单位毫秒|
|
|target|String|self|在哪个小程序目标上发生跳转,默认当前小程序,值域self/miniProgram|微信2.0.7+、百度2.5.2+、QQ|
**open-type 有效值**
...
...
@@ -24,11 +25,13 @@
|redirect|对应 uni.redirectTo 的功能||
|switchTab|对应 uni.switchTab 的功能||
|reLaunch|对应 uni.reLaunch 的功能|头条小程序不支持|
|navigateBack|对应 uni.navigateBack 的功能|
|
|navigateBack|对应 uni.navigateBack 的功能||
|exit|退出小程序,target="miniProgram"时生效|微信2.1.0+、百度2.5.2+、QQ1.4.7+|
**注意**
-
navigator-hover 默认为 {background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;},
``<navigator>``
的子节点背景色应为透明色。
**
-
app-nvue 平台只有纯nvue项目(render为native)才支持
`<navigator>`
。非render为native的情况下,nvue暂不支持navigator组件,请使用API跳转。
-
app下退出应用,Android平台可以使用
[
plus.runtime.quit
](
https://www.html5plus.org/doc/zh_cn/runtime.html#plus.runtime.quit
)
**示例**
[
查看示例
](
https://uniapp.dcloud.io/h5/pages/component/navigator/navigator
)
...
...
docs/component/picker.md
浏览文件 @
99ca49fb
...
...
@@ -112,7 +112,7 @@
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|x|x|√|x|√|√|√|
-
因省市区选择器包含大量数据,占用体积,并非所有应用都需要,且很多城市数据有自维护需求,所以在App和H5平台没有内置。可以基于多列picker或picker-view,自行填充城市数据,插件市场有较多类似插件,
[
详见
](
https://ext.dcloud.net.cn/search?q=%E5%9F%8E%E5%B8%82%E9%80%89%E6%8B%A9
)
。注意基于多列picker方式的地区选择不能运行在支付宝小程序上,只有基于picker-view的可以全端运行。
已知mpvue-picker插件是基于picker-view的
。
-
因省市区选择器包含大量数据,占用体积,并非所有应用都需要,且很多城市数据有自维护需求,所以在App和H5平台没有内置。可以基于多列picker或picker-view,自行填充城市数据,插件市场有较多类似插件,
[
详见
](
https://ext.dcloud.net.cn/search?q=%E5%9F%8E%E5%B8%82%E9%80%89%E6%8B%A9
)
。注意基于多列picker方式的地区选择不能运行在支付宝小程序上,只有基于picker-view的可以全端运行。
这些插件中,比较推荐的是
[
SimpleJalon的地址联动选择插件
](
https://ext.dcloud.net.cn/plugin?id=1084
)
,它可以同时兼容app-nvue、app-vue、h5、及各端小程序
。
|属性名|类型|默认值|说明|
|:-|:-|:-|:-|
...
...
docs/component/progress.md
浏览文件 @
99ca49fb
...
...
@@ -7,11 +7,14 @@
|:- |:- |:- |:- |:- |
|percent |Float |无 |百分比0~100 | |
|show-info |Boolean |false |在进度条右侧显示百分比 | |
|border-radius|number/string|0|圆角大小|微信基础库2.3.1+、QQ小程序|
|font-size|number/string|16|右侧百分比字体大小|微信基础库2.3.1+、QQ小程序|
|stroke-width |Number |6 |进度条线的宽度,单位px | |
|activeColor |Color |#09BB07 |已选择的进度条的颜色 | |
|activeColor |Color |#09BB07
(百度为#E6E6E6)
|已选择的进度条的颜色 | |
|backgroundColor|Color |#EBEBEB |未选择的进度条的颜色 | |
|active |Boolean |false |进度条从左往右的动画 | |
|active-mode |String |backwards |backwards: 动画从头播;forwards:动画从上次结束点接着播|微信小程序、5+APP、H5 |
|active-mode |String |backwards |backwards: 动画从头播;forwards:动画从上次结束点接着播|App、H5、微信小程序、QQ小程序 |
|duration|number|30|进度增加1%所需毫秒数|微信基础库2.8.2+|
|@activeend |EventHandle| |动画完成事件 |微信小程序 |
**示例**
[
查看演示
](
https://uniapp.dcloud.io/h5/pages/component/progress/progress
)
...
...
@@ -36,4 +39,4 @@
</template>
```
![](
https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/propress.png
)
\ No newline at end of file
![](
https://img-cdn-qiniu.dcloud.net.cn/uniapp/doc/img/propress.png
)
docs/component/rich-text.md
浏览文件 @
99ca49fb
...
...
@@ -3,9 +3,11 @@
**属性说明**
|属性名|类型|默认值|说明|
|:-|:-|:-|:-|
|nodes|Array / String|[]|节点列表 / HTML String|
|属性名|类型|默认值|说明|平台兼容|
|:-|:-|:-|:-|:-|
|nodes|Array / String|[]|节点列表 / HTML String||
|
[
space
](
https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html
)
|string||显示连续空格|微信基础库2.4.1+、QQ小程序|
|selectable|Boolean|false|富文本是否可以长按选中,可用于复制,粘贴等场景|百度APP 11.10+|
**注意**
...
...
docs/component/video.md
浏览文件 @
99ca49fb
...
...
@@ -5,7 +5,7 @@
|App|H5|微信小程序|支付宝小程序|百度小程序|头条小程序|QQ小程序|
|:-:|:-:|:-:|:-:|:-:|:-:|:-:|
|√|√|√|
x
|√|√|√|
|√|√|√|
基础库1.10.0+
|√|√|√|
**属性说明**
...
...
@@ -141,7 +141,7 @@ export default {
-
视频播放格式说明:
*
H5平台:支持支持的视频格式视浏览器而定,一般通用的都支持:mp4、webm 和 ogg。(
``<video/>``
组件编译到 H5 时会替换为标准 html 的 video 标签)。H5端也可以自行在条件编译里使用video.js等三方库,这些库可以自动判断环境兼容以决定使用标准video或flash来播放。
*
小程序平台:各小程序平台支持程度不同,详见各家文档:
[
微信小程序视频组件文档
](
https://developers.weixin.qq.com/miniprogram/dev/component/video.html
)
、
支付宝不支持video组件
、
[
百度小程序视频组件文档
](
https://smartprogram.baidu.com/docs/develop/component/media/#video/
)
、
[
头条小程序视频组件文档
](
https://developer.toutiao.com/dev/cn/mini-app/develop/component/media-component/video
)
*
小程序平台:各小程序平台支持程度不同,详见各家文档:
[
微信小程序视频组件文档
](
https://developers.weixin.qq.com/miniprogram/dev/component/video.html
)
、
[
支付宝小程序video组件
](
https://docs.alipay.com/mini/component/video
)
、
[
百度小程序视频组件文档
](
https://smartprogram.baidu.com/docs/develop/component/media/#video/
)
、
[
头条小程序视频组件文档
](
https://developer.toutiao.com/dev/cn/mini-app/develop/component/media-component/video
)
*
App平台: 支持本地视频(mp4/flv)、网络视频地址(mp4/flv/m3u8)及流媒体(rtmp/hls/rtsp)。
-
video全屏后,如何自行绘制界面?比如加个标题、加个分享按钮
...
...
docs/ecosystem.md
浏览文件 @
99ca49fb
```
uni-app``` 积极拥抱前端社区,创建了开放、兼容的生态系统。
- [uni-app插件市场](https://ext.dcloud.net.cn),支持前端组件、js sdk、页面模板、项目模板、原生插件等多种类型,并为插件作者提供了荣誉+经济回报的双激励模式,打造最强大的开放生态。
- [uni-app插件市场](https://ext.dcloud.net.cn),
有数千款插件,
支持前端组件、js sdk、页面模板、项目模板、原生插件等多种类型,并为插件作者提供了荣誉+经济回报的双激励模式,打造最强大的开放生态。
- 兼容微信小程序 JS SDK,丰富的小程序生态内容可直接引入```uni-app```,并且在App侧通用。以前的跨平台开发框架普遍缺少三方SDK,由于大量SDK厂商均原厂维护小程序SDK,使得```uni-app```成为跨平台开发框架里生态最丰富的平台[参考](https://ask.dcloud.net.cn/article/35070)
...
...
docs/release.md
浏览文件 @
99ca49fb
此差异已折叠。
点击以展开。
docs/select.md
浏览文件 @
99ca49fb
...
...
@@ -45,11 +45,12 @@ DCloud的盈利方式在帮助开发者进行推广和流量变现上,而不
1. uni-app无需追随微信升级,可不受限在条件编译里使用wx的现在或未来的所有api
2. uni-app的性能比一般人手写的微信原生代码性能更高。就像vue操作比一般人写js操作dom性能更高一样。底层自动diff差量更新数据,比手动setData性能更高。评测数据见下文
3. uni-app是纯vue语法,不必另学一种dsl。开发不同项目时,思维不用切换
4. uni-app的组件、模板非常丰富,插件市场
800多
款插件。如富文本解析、图表等组件,uni-app版插件性能均超过了wxparse、wx-echart等微信小程序组件
4. uni-app的组件、模板非常丰富,插件市场
数千
款插件。如富文本解析、图表等组件,uni-app版插件性能均超过了wxparse、wx-echart等微信小程序组件
5. HBuilderX比微信工具更强大,开发效率更高。哪怕使用vscode等工具,由于这些工具对vue的支持强于对wxml的支持,所以开发效果也会更高
6. 微信原生开发对webpack、预编译语言、工程流程管理很多功能都不支持,大公司很少用微信原生开发,都是在用框架来提升开发效率
7. 迟早会有需求发布到其他小程序平台,或H5/App,使用`uni-app`再无后续顾虑
8. uni-app并非仅用于做跨端的,只用uni-app做小程序、只做H5、只做App的,案例是一样多的,详见:https://uniapp.dcloud.io/case
7. uni-app支持双向数据绑定、vuex状态管理,比小程序原生开发方便的多
8. 迟早会有多端需求,使用`uni-app`再无后续顾虑
9. uni-app并非仅用于做跨端的,只用uni-app做小程序、只做H5、只做App的,案例是一样多的,详见:https://uniapp.dcloud.io/case
关于uni-app和微信开发的详细比较评测,参考:https://ask.dcloud.net.cn/article/36484
- 评测1、uni-app和原生wxml开发、wepy、mpvue、taro的对比,[https://ask.dcloud.net.cn/article/35867](https://ask.dcloud.net.cn/article/35867)
...
...
@@ -116,7 +117,7 @@ plus api的结合解决了这个问题,大多数App的开发不再需要原生
```
uni-app
``` 提供了开放性的生态:
- 丰富的插件市场为开发者提供
大量
现成的轮子,[https://ext.dcloud.net.cn](https://ext.dcloud.net.cn)
- 丰富的插件市场为开发者提供
数千款
现成的轮子,[https://ext.dcloud.net.cn](https://ext.dcloud.net.cn)
- 兼容微信小程序 JS SDK,丰富的小程序生态内容可直接引入uni-app,并且在App侧通用,[参考](http://ask.dcloud.net.cn/article/35070)
- 兼容微信小程序自定义组件,并且App侧通用,[参考](http://uniapp.dcloud.io/frame?id=小程序组件支持)
- 支持 NPM 包管理系统,[参考](http://uniapp.dcloud.io/frame?id=npm%E6%94%AF%E6%8C%81)
...
...
@@ -129,9 +130,7 @@ plus api的结合解决了这个问题,大多数App的开发不再需要原生
**uni-app 支持的手机版本最低到多少?**
Android4.4、iOS8是官方会保障兼容的。
更低版本或许能用,但官方发布时不会测试更低版本。要知道Android4.4已经是2013年发布的手机了,正常用户不会还在用这么久远的手机。
开发时尽量避免使用太新的css,可能在老款手机上产生浏览器兼容问题。
要知道Android4.4已经是2013年发布的手机了,正常用户不会还在用这么久远的手机。
**uni-app成熟度高吗?**
...
...
@@ -145,7 +144,7 @@ Android4.4、iOS8是官方会保障兼容的。
插件市场内容也非常丰富,各种轮子方便可用。[https://ext.dcloud.net.cn/](https://ext.dcloud.net.cn/),并且很多轮子的uni-app版,性能功能都强于微信小程序版。
基于```
uni-app
```的三方培训也很多。腾讯课堂官方
都
为uni-app制作了课程。
基于```
uni-app
```的三方培训也很多。腾讯课堂官方
亲自
为uni-app制作了课程。
**uni-app 有哪些已上线的成功案例?**
...
...
@@ -154,7 +153,7 @@ Android4.4、iOS8是官方会保障兼容的。
**DCloud是家什么公司,是否可信赖**
```
DCloud
```从2013年开始做HBuilder,目前3
7
0万前端开发者在使用```
DCloud
```的开发工具,HBuilder百度指数与sublime、webstorm等全球知名工具相同。是中国唯一一家成功的开发工具厂商。
```
DCloud
```从2013年开始做HBuilder,目前3
8
0万前端开发者在使用```
DCloud
```的开发工具,HBuilder百度指数与sublime、webstorm等全球知名工具相同。是中国唯一一家成功的开发工具厂商。
```
DCloud
```是明星创业公司,融资已经过了B2轮,且均为知名VC或战略投资人。
...
...
@@ -162,8 +161,6 @@ Android4.4、iOS8是官方会保障兼容的。
```
DCloud
```产品中使用的HTML5Plus规范,为联盟的标准规范而非私有api。
开发者使用```
DCloud
```5+引擎打包的App,这些App已经安装激活在**4亿**台手机设备上,广泛应用于各行各业。
```
DCloud
```的产品技术一直引领业内,2015年就上线业内第一个"小程序":DCloud流应用。随后DCloud广泛推动业内各大公司上线"小程序",普及该技术广泛应用。
数年来只有其他公司侵权DCloud,这些作恶公司已被法院判决给DCloud赔款道歉,DCloud从未有劣迹,诚信立足于行业。
...
...
@@ -174,7 +171,7 @@ Android4.4、iOS8是官方会保障兼容的。
代码可以云打包,也可以离线打包。
即使使用云打包,DCloud也不会保留开发者的代码,云端打包完成后程序不会持久化存储相关文件,
会立即删除。
DCloud不愿也不敢沾惹这方面的麻烦。
即使使用云打包,DCloud也不会保留开发者的代码,云端打包完成后程序不会持久化存储相关文件,DCloud不愿也不敢沾惹这方面的麻烦。
之所以提供云打包,是方便不熟悉原生的前端工程师直接生成App安装包。包括让没有mac电脑的工程师也可以打出iOS的包。
...
...
src/platforms/h5/service/api/media/choose-video.js
浏览文件 @
99ca49fb
...
...
@@ -55,7 +55,7 @@ export function chooseVideo ({
}
const
video
=
document
.
createElement
(
'
video
'
)
if
(
video
.
onloadedmetadata
)
{
if
(
video
.
onloadedmetadata
!==
undefined
)
{
// 尝试获取视频的宽高信息
video
.
onloadedmetadata
=
function
()
{
callbackResult
.
duration
=
video
.
duration
||
0
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录