小程序里的组件也是由宿主环境提供的,可以利用组件快速的实现页面结构。
说明文档:https://developers.weixin.qq.com/miniprogram/dev/component/
常用的组件
1、视图容器组件view
:普通视图区域;类似HTML
的div
,是一个块级元素;scroll-view
:可滚动的视图容器swiper
和swiper-item
:轮播图组件
<view class="view-box">
<view>A</view>
<view>B</view>
<view>C</view>
</view>
<scroll-view class="scroll-view" scroll-y>
<view>A</view>
<view>B</view>
<view>C</view>
</scroll-view>
<swiper indicator-dots autoplay>
<swiper-item>A</swiper-item>
<swiper-item>B</swiper-item>
<swiper-item>C</swiper-item>
</swiper>
2、基础内容组件text
:文本组件rich-text
:富文本组件,可以吧html
字符串渲染为wxml
结构
<text user-select>手机号:1111111</text>
<rich-text nodes="<h1>标题h1</h1>"></rich-text>
3、其他组件button
:按钮组件,比html
里的button
功能丰富image
:图片组件navigator
:页面导航组件,类似a
标签
<button type="primary">按钮</button>
<image src="https://res.wx.qq.com/wxdoc/dist/assets/img/0.4cb08bb4.jpg" show-menu-by-longpress></image>