微信小程序——组件基础
view组件
view组件,是最基础的组件,相当于HTML里的div组件
常用属性
属性 | 说明 |
---|---|
hover-class | 按下去可以显示样式类 |
hover-stop-propagation | 防止样式冒泡 |
swiper组件
swiper组件是滑块视图容器,常用来作为轮播图
常用属性
属性 | 说明 |
---|---|
indicator-dots | 是否显示面板指示点 |
indicator-color | 指示点颜色 |
indicator-active-color | 当前选中的指示点颜色 |
autoplay | 自动轮播 |
interval | 轮播时间间隔 |
circular | 衔接滑动 |
vertical | 纵向轮播 |
scroll-view组件
scroll-view组件,可以设置滑动窗口
常用属性
属性 | 说明 |
---|---|
scroll-x | 允许横向滚动 |
scroll-y | 允许纵向滚动 |
scroll-top | 设置纵向滚动条位置(常在多菜单时配合数据绑定,设置为0) |
scroll-left | 设置横向滚动条位置(常在多菜单时配合数据绑定,设置为0) |
text组件
text组件可以设置文本是否可选
常用属性
属性 | 说明 |
---|---|
user-select | 文本是否可选,该属性会使文本节点显示为 inline-block |
decode | 是否解码,常用在带有 时 |
button组件
button组件可以设置客服聊天
常用属性
属性 | 说明 |
---|---|
open-type | contact设置为客服聊天 |
type | 类型primary绿色,warn红色,default白色 |
navigator组件
相当于HTML里的a标签,超链接组件
常用属性
属性 | 说明 |
---|---|
url | 内部跳转地址 |
open-type | 跳转类型:redirect/relaunch,打开新页面 |
image组件
常用属性
属性 | 说明 |
---|---|
src | 图片路径 |
mode | 模组:widthFix,heightFix |
show-menu-by-longpress | 显示发送朋友选项 |