uniapp多媒体组件及配置项

一.audio音频

data:function() {
	return {
		audioSrc:"https://img-cdn-qiniu.dcloud.net.cn/uniapp/audio/music.mp3"
	}
}

常用属性：

• src 播放地址
• loop 是否循环播放 默认值false
• controls 是否显示默认控件 默认值false

二.image图片

常用属性：mode 图片裁剪、缩放的模式

mode有效值：4种缩放模式，9种裁剪模式
缩放：
scaleToFill 默认值，不保持纵横比缩放图片，使图片的宽高完全拉伸至填满 image 元素；
widthFix宽度不变，高度自动变化，保持原图宽高比不变

裁剪：
top不缩放图片，只显示图片的顶部区域
left不缩放图片，只显示图片的左边区域
top left不缩放图片，只显示图片的左上边区域

注：① 组件默认宽度 300px、高度 225px；
②使用 image 可能导致样式生效较慢，出现 “闪一下” 的情况，设置 image{will-change: transform} ,可优化此问题

三.video视频

常用属性：

• autoplay 是否自动播放 默认值false
• loop 是否循环播放 默认值false
• controls 是否显示默认播放控件（播放/暂停按钮、播放进度、时间）默认值true

注： 默认宽度 300px、高度 225px，可通过 css 设置宽高

四.配置

1.pages.json 文件用来对 uni-app 进行全局配置，决定页面文件的路径、窗口样式、原生的导航栏、底部的原生tabbar等。

(1)pages.json中的tabBar
可以通过 tabBar 配置项指定 tab 栏的表现，以及 tab 切换时显示的对应页
注：
①tabBar 中的 list 是一个数组，只能配置最少2个、最多5个 tab，tab 按数组的顺序排序
②tabbar 的页面展现过一次后就保留在内存中，再次切换 tabbar 页面，只会触发每个页面的onShow，不会再触发onLoad
③代码跳转到tabbar页面，api只能使用uni.switchTab，不能使用uni.navigateTo、uni.redirectTo；使用navigator组件跳转时必须设置open-type="switchTab"

(2)pages.json中的globalStyle

"globalStyle": {
	"navigationBarTextStyle": "black",
	"navigationBarTitleText": "uni-app",
	"navigationBarBackgroundColor": "#F8F8F8",
	"backgroundColor": "#F8F8F8",
}

• navigationBarTextStyle：导航栏文字的样式
• navigationBarTitleText：导航栏文字
• navigationBarBackgroundColor：导航栏的背景颜色
• backgroundColor：整个页面的背景颜色

2.manifest.json 文件是应用的配置文件，用于指定应用的名称、图标、权限等
3.package.json文件中增加uni-app扩展节点，可实现自定义条件编译平台
4.vue.config.js 是一个可选的配置文件，如果项目的根目录中存在这个文件，那么它会被自动加载
5.uni.scss文件是为了方便整体控制应用的风格。比如按钮颜色、边框风格
6.App.vue是uni-app的主组件，所有页面都是在App.vue下进行切换的，是页面入口文件。
7.main.js是uni-app的入口文件，主要作用是初始化vue实例、定义全局组件、使用需要的插件如vuex