组件

一.小程序中组件的分类

，开发者可以基于组件快速搭建出漂亮的页面解构。官方把小程序的组件分为了9大类：分别是：（标红的为常用）
(1).

• 普通视图区域
• 类似于Html中的div，是一个块级元素
• 常用来实现页面的布局效果

二、view组件的基本使用

image.png

• 可滚动的视图区域

• 常用来实现滚动列表效果

  
  
  image.png

image.png

• 轮播图容器组件 和 轮播图item组件

1.swiper 和 swiper-item 组件的基本使用

image.png

2.swiper组件的常用属性

image.png

(2).

1.常用的基础内容组件

• 文本组件
• 类似于HTML中的span标签，是一个行元素

文本选中效果属性：

image.png

text组件的基本使用

通过text组件的selectable属性，实现长按选中文本内容的效果：

• 富文本组件
• 支持把HTML 字符串渲染为WXML结构

通过richg-text组件的nodes属性节点，把html字符串渲染为对应的UI解构

image.png

(3).
  button

• 按钮组件
• 功能比html中的button按钮丰富

• 通过open-type属性可以调用微信提供各种功能（客服、转发、获取用户授权、获取用户信息等）

  
  
  image.png

 image

• 图片组件

• image组件默认宽度约300px、高度约240px

  
  
  image.png

image组件中的mode属性

image组件的mode属性用来孩子定图片的裁剪和缩放，常用的mode属性值如下：

image.png

(4).
  navigator

• 页面导航组件
• 类似于HTML中的a链接
  (5).媒体组件
  (6).map地图组件
  (7).canvas 画布组件
  (8).开放能力
  (9). 无障碍访问

4.API

一、小程序的API概述

.，通过这些丰富的小程序API，开发者可以方便的i奥用微信提供的能力，例如：获取用户信息、本地储存、支付功能等

二、API的3大类

.

• 特点： 以 .开头，用来.
• 举例：调用. (function callback)监听窗口尺寸变化的事件
  .
• 特点1： 以结尾的Api都是同步Api
• 特点2： 同步APi的执行结果，可以通过函数返回值直接获取，如果执行出错会抛出异常
• 举例：调用('key','value')向本地储存写入内容
  .
• 特点：.函数，需要通过success、fail、complete 接收调用的结果
• 举例：wx..()发送网络数据请求、通过success回调函数接收数据