小程序常用标签记录

view + text
selectable 控制文本是否可选

<view class="container">
  <text>这是一个容器</text>
</view>

用于渲染富文本内容（如包含 HTML 标签的字符串），类似 HTML 中的

配合 innerHTML，但支持的标签有限（需通过 nodes 属性传入结构化数据或 HTML 字符串）

scroll-view

带滚动功能的容器，类似 HTML 中设置了 overflow: scroll 的

，可实现横向或纵向滚动。
常用属性：scroll-x（横向滚动）、scroll-y（纵向滚动）、scroll-top（滚动到指定位置）

<scroll-view scroll-y style="height: 300rpx">
<view v-for="{{items}}">{{item}}</view>
</scroll-view>

image

对应 HTML 中的 ，用于展示图片，支持本地图片、网络图片（需配置域名白名单）。
常用属性：src（图片路径）、mode（图片裁剪 / 缩放模式，如 widthFix 保持宽高比）、lazy-load（懒加载）

<image src="/images/logo.png" mode="widthFix"></image>

video

对应 HTML 中的 ，用于播放视频，支持控制播放、暂停、全屏等功能。

button

按钮组件，功能类似 HTML 的 ，但自带更多样式（如默认、primary、warn 主题）和功能（如获取用户信息、分享等开放能力）。

<button type="primary" bindtap="handleClick">点击我</button>

input

输入框，对应 HTML 的 ，支持单行文本输入，通过 type 属性指定类型（如 text、number、password）。

textarea

多行文本输入框，对应 HTML 的 ，支持自动换行和高度自适应。

checkbox , radio

复选框和单选框，类似 HTML 的 和 ，但通常需要配合 / 管理选中状态。

navigator

导航组件，对应 HTML 的 标签，用于页面跳转，支持跳转到当前小程序内的页面或外部链接（需配置）。

<navigator url="/pages/detail/detail">跳转到详情页</navigator>

icon

小程序内置图标组件，支持多种默认图标（如成功、警告、加载等），无需引入外部图片

swiper,swiper-item

轮播图组件， 是容器， 是每个轮播项，类似 HTML 中基于 JavaScript 实现的轮播插件。

六、小程序标签与 HTML 标签的核心区别
封闭性：小程序标签是平台自定义的组件，不支持 HTML 标签（如

在小程序中无效）。
功能集成：很多标签自带小程序特有的功能（如 可直接调用微信登录 API）。
样式限制：小程序的 CSS 支持部分属性，不支持 * 选择器、box-shadow 部分参数等，且需通过 class 绑定样式（不支持 id 选择器）。
如果使用 Taro、UniApp 等跨端框架开发，框架会自动将

等标签编译为小程序对应的 ，降低学习成本。