uniapp---uniapp学习笔记总结（二）-uniapp组件学习

uniapp组件包括视图容器、基础内容、表单组件、路由与页面跳转、媒体组件、地图、画布、webview等。

     具体用法：       

 

     效果参考：https://hellouniapp.dcloud.net.cn/pages/component/view/view                                    

分类	组件	说明
视图容器	view	相当于HTML中的div，用于包裹各种元素内容
	scroll-view	可滚动，用于区域滚动。注意：横向滚动需要设置scroll-view样式不换行【white-space: nowrap;】设置scroll-view子元素样式为行内块元素【display: inline-block;】
	swiper	可滑动，常用作banner轮播图
	match-media	可适配不同屏幕，类似于媒体查询media，用于适配大小屏。
	match-area、movable-view	可拖动区域组件，注意：movable-area 、movable-view必须设置 width 和 height 属性，不设置默认为 10px movable-view必须在movable-area组件中，并且必须是直接子节点，否则不能移动。
	cover-view	覆盖在原生组件上的文本视图
	cover-image	覆盖在原生组件上的图片视图
基础内容	icon	图标，注意不同端的属性type的不同有效值
	text	文本组件，用于包裹文本。<text> 组件内只支持嵌套 <text>，支持\n换行
	rich-text	富文本，属性nodes数据类型可为String和Array，荐使用 Array 类型，由于组件会将 String 类型转换为 Array 类型，因而性能会有所下降。
	progress	进度条
表单组件	button	按钮，注意form-type 属性
	checkbox-group	多项选择器，内部由多个 checkbox 组成。
	checkbox	多选项目。如需调节checkbox大小，可通过css的scale方法调节，如缩小到70%style="transform:scale(0.7)"
	editor	文本编辑器，可以对图片、文字格式进行编辑和混排。
	form	表单，将组件内的用户输入的<switch> <input> <checkbox> <slider> <radio> <picker> 提交。
	input	输入框
	label	用来改进表单组件的可用性，使用for属性找到对应的id，或者将控件放在该标签下，当点击时，就会触发对应的控件。
	picker	从底部弹起的滚动选择器。支持五种选择器，通过mode来区分，分别是普通选择器，多列选择器，时间选择器，日期选择器，省市区选择器，默认是普
	picker-view	嵌入页面的滚动选择器。
	radio	单项选择器，内部由多个 <radio> 组成。通过把多个radio包裹在一个radio-group下，实现这些radio的单选。
	slider	滑动选择器。
	switch	开关选择器。
	textarea	多行输入框。
路由和页面跳转	navigator	页面跳转。该组件类似HTML中的<a>组件，但只能跳转本地页面。目标页面必须在pages.json中注册。
	custom-tab-bar	自定义tabBar组件。可以自定义摆放的位置，可以灵活的配置各种css
媒体组件	audio	音频
	camera	相机组件，在 App 和 H5 端，可以使用API方式来调用全屏摄像头，而不是组件内嵌方式
	image	图片，属性mode 有 13 种模式，其中 4 种是缩放模式，9 种是裁剪模式。
	video	视频播放组件
	live-player	实时音视频播放，也称直播拉流
	live-pusher	实时音视频录制，也称直播推流
地图	map	地图组件。用于展示地图，
画布	canvas	画布
webview	webview	web 浏览器组件，可以用来承载网页的容器
广告	ad	应用内展示的广告组件，可用于banner或信息流。
...	...	......