微信小程序为开发人员提供了众多的基础开发组件，利用这些组件，开发人员可以更为便捷迅速的完成开发工作，下面我就给大家介绍一下，比较常见的小程序开发组件有哪些。 

 

什么是小程序开发组件？

 

组件是小程序视图层的基本组成单元，它自带一些功能与微信风格相符的样式，一个组件通常包括开始标签和结束标签，属性用来对这个组件进行修饰，内容在两个标签之间。 常见的小程序开发组件有哪些？

小思经过总结之后发现，比较常见的小程序开发组件有以下这八种：

 

1.视图类组件

视图可以类比html中的div，所有的组件都嵌套在视图容器中，视图组件分为以下几类：

 

view（视图容器组件）

scroll-view（可滚动视图容器组件）

swiper（滑块视图容器组件）

movable-area（可移动的视图容器组件）

cover-view（覆盖视图组件）

 

2.基础内容类组件

小程序基础内容类组件包括icon图标组件、text文本组件、progress进度条组件三种。

 

icon图标组件：微信小程序为不同的场景提供了丰富的图标，带有不同含义的图标，如成功，警告，取消，下载等等。

 

text文本组件： text文本组件支持转义字符\，例如换行\ n，空格 \ t，并且<text/> 组件内只支持 <text/> 嵌套，除了文本节点以外的其他节点都无法长按选中。

 

text文本组件组件是放置在一行当中的，不同于view组件。

 

进度条组件：进度条组件是一种可以增强用户体验的组件。 就像播放视频一样，用户可以通过进度条查看完整的视频长度和当前进度。 这允许用户更为合理的安排他们自己的时间并改善用户体验，另外微信小程序还提供了一个progress进度条组件。

 

3.表单类组件

表单类组件可以细分为button按钮组件、checkbox多项选择器组件、form表单组件、input输入框组件、label改进表单组件、picker选择器组件、picker-view嵌入页面的滚动选择器组件、radio单项选择器组件、slider滑动选择器组件、switch开关选择器组件、textarea多行输入框组件等十一个组件。

 

4.导航类组件

navigator导航页面链接组件是用在wxml页面中跳转的导航，它主要有三种类型。

 

第一种：保留当前页面之后跳转，跳转后可以返回当前页，它与wx.navigatorTo跳转效果是一样的。

 

第二种：关闭当前页面跳转，无法返回当前页，它与wx.reditrctTo跳转效果是一样的。

 

第三种：跳转到底部标签导航的指定页面，它与wx.switchTab跳转效果是一样的。

 

5.媒体类组件

小程序媒体类组件可以细分为audio音频组件、image图片组件、video视频组件三种类型。

 

6.地图类组件

移动应用中地图是必不可缺的内容，通过地图可以很直观地表现出地理位置信息，为此小程序提供了<map/>组件。

 

7.画布类组件

canvas画布组件可以用来绘制图形和动画，图形和动画的具体实现要借助API wx.createCanvasContext，wx.createCanvasContext返回一个canvas对象，它有很多的绘图方法，譬如描边、画矩形、圆形等等。

 

8.客服类组件

利用contact-button客服会话按钮组件，开发者可以在页面当中添加一个客服会话按钮，用户点击该按钮后就可以进入客服会话。