什么是组件？
组件就是我们在HTML中编写的一些基础标签，比如div，span，p，ul，li等。在大多数HTML标签中，很多标签都是需要写一些效果的，但在小程序中，很多标签都是自带效果的，可以实现一些简单的JS逻辑。
微信小程序中有很多有意思的组件，大大方便了我们进行小程序的开发。
小程序页面可以拆分成多个部分，组件是构成小程序页面的基本构件。为了让开发者能够快速开发，小程序宿主环境提供了一系列基础组件。
组件用于 WXML 模板文件声明，WXML 的语法与 HTML 类似，小程序使用标签名来引用组件，标签名通常包含开始标签和结束标签，标签的属性用于描述组件。
组件类型小程序根据应用场景将组件分为以下几种常见类型
①视图容器组件---view、swiper ②基础内容组件---icon ③表单组件 ④导航组件 ⑤媒体组件 ⑥地图组件 ⑦画布组件
页
首先新建一个视图文件夹，并编写测试视图容器组件代码
为了方便查看调试代码，我们将创建一个新的组件来测试相关组件的效果。
查看容器组件
①view视图容器
视图组件：是小程序里的基础组件，相当于HTML里的div标签，它有几个很棒的属性可以用来简化我们的小程序开发。
范围：
①-这个属性后面跟着一个类名，当点击这个组件的时候，添加这个类，相当于在PC端移动鼠标的效果。
②-stop-布尔值，用于停止冒泡行为-
③--time 点击视图后，需要多少毫秒才会出现
④-stay-time：手指松开后停留的时间，单位为毫秒
②视图容器组件和-item滑块组件
大图滚动组件；经常有我们需要添加大图滚动的效果，这个组件就可以轻松的帮助我们完成这个任务。
滑块视图容器中只能放置 -item 组件，否则会导致未定义的行为。它是大图像滚动的最外层标签，每个滚动项都在 -item 内部。
注意：-item 只能放在组件内，宽高自动设置为100%
将容器放在左边外层，里面滑动的轮播item用-item 组件，此时可以实现基本的轮播功能，但是需要进行两次样式调整。
①容器组件默认样式
②-Item默认宽高为100%
③默认图片风格
-item 组件通常是通过循环获取的，因此这里需要做一些调整
自动切换和方向
自动切换和方向：下一步测试
注意：
当前滑块的值不能超过滑块组件索引。如果超过，控制台将显示警告
布局样式
布局样式—开关触发功能
函数返回值
只能放在一个组件中，宽高自动设置为100%
设置了item-id，也就是滑块组件item的标识之后，在事件触发的时候就可以获取到滑块组件标识。
函数返回值
事件返回值
从1.4.0开始，事件增加了一个字段来表示变化的原因，可能的值如下：
① 自动播放导致的变更
② 用户滑动引起的变化
③其他原因将以空字符串表示
微信小程序实现滑动缩放效果
滑块视图容器属性
- 法律价值
①默认缓动函数；②线性动画；③缓动动画
④ 慢放动画；⑤ 慢进慢放动画
滑块视图容器属性
设置属性后，滑动轮播图就会触发该事件。
设置动画结束时触发的事件
属性设置动画结束时触发事件
此时切换完成就会触发事件。
注意：
-item 组件只能放在组件内，宽高自动设置为 100%
③-area可移动区域组件和-view可移动视图组件
-view 是可移动的视图，可以在页面上拖动滑动。
注意：与-item和关系类似。-view移动视图必须在-area移动区域组件内，并且必须是直接子节点，否则无法移动。
-view 参数
可移动的方向有：所有方向、垂直方向、水平方向、无。
当 设置为 true 时，松开手指之后，移动的视图仍然会滑动一段距离。
Out-of-(限制/限制范围) 设置为 true 时，仍然可以超出
摩擦系数越大（高速公路），惯性滑行距离越短；摩擦系数越小（冰场），惯性滑行距离越长；
官方文档： view when true
问题：
，与设置为 true 效果相同。
注意：与-stop-属性类似，一旦添加该属性，无论是否设置为true，都会被禁用。
问题：-view设置为true之后发现不能缩放
原因：可移动视图太小，缩放手势在较小范围内。请重新设置视图大小。
-area 参数只有一个
当将可移动视图区域 -area 设置为 true 时，缩放手势有效区域修改为整个 -area
-min缩小阈值为0.5，即宽高最多可以缩小一半
-max方法临界值为10，即宽高最多放大10倍
-定义初始渲染的缩放系数，默认是wxss样式定义的大小
范围
返回值表明移动的原因。
④-view可滚动视图区域
-view为滚动视图，分为水平滚动和垂直滚动。
注意：垂直滚动的时候必须设置高度，否则view不会
滚动视图通常用于包含许多项目的界面。
注意：
①-top仅用于设置垂直滚动条位置，-left仅用于设置水平滚动条位置
② 如果要使用下拉刷新，开发中请使用页面滚动代替-view