微信小程序——组件

微信小程序中的组件是由微信提供的,开发者可以基于组件快速的搭建出页面。微信小程序的组件可以分为9大类,分别是视图容器、基础内容、表单组件、导航组件、 媒体组件、map 地图组件、canvas 画布组件、开放能力和无障碍访问。

视图容器类组件

  1. view
  • 普通的视图区域
  • 类似于 HTML 中的 div 标签,是一个块级元素
  • 常用来实现页面的布局效果
  1. scroll-view
  • 可滚动的视图区域
  • 常用来实现滚动的列表效果
  1. swiper 和 swiper-item
  • 轮播图容器组件和轮播图单元组件
  • 基本使用
swiper 组件属性

基础内容类组件

  1. text
  • 文本组件
  • 类似于 HTML 中的 span 标签,是一个行内元素
  • 使用
    小程序中只有 text 组件能够实现文本的长按选中,通过 text 组件的 selectable 属性,可以实现长按选中文本的效果
  1. rich-text
  • 富文本组件
  • 支持把 HTML 字符串渲染为 WXML 结构
  • 使用
    通过 rich-text 组件的 nodes 属性节点,可以把 HTML 字符串渲染为对应的 UI 结构

其他常用组件

  1. button
  • 按钮组件
  • 功能比 HTML 中的 button 更丰富
  • 通过 open-type 属性可以调用微信提供的各种功能,如转发、获取用户信息等
  • 基本使用
代码

显示效果
  1. image
  • 图片组件
  • image 组件默认的宽度约 300px,高度约 240px
  • 基本使用
    可以使用 image 组件的 mode 属性来指定图片的剪裁和缩放模式,mode 基本属性如下
mode 常用属性
  1. navigator
  • 页面的导航组件
  • 类似于 HTML 中的 a 链接
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容