自在天 每日分享

每日分享

swiper滑动容器

swiper

基础库 1.0.0 开始支持,低版本需做兼容处理

滑块视图容器。其中只可放置swiper-item组件,否则会导致未定义的行为。

属性类型默认值必填说明最低版本
indicator-dotsbooleanfalse是否显示面板指示点1.0.0
indicator-colorcolorrgba(0, 0, 0, .3)指示点颜色1.1.0
indicator-active-colorcolor#000000当前选中的指示点颜色1.1.0
autoplaybooleanfalse是否自动切换1.0.0
currentnumber0当前所在滑块的 index1.0.0
intervalnumber5000自动切换时间间隔1.0.0
durationnumber500滑动动画时长1.0.0
circularbooleanfalse是否采用衔接滑动1.0.0
verticalbooleanfalse滑动方向是否为纵向1.0.0
previous-marginstring"0px"前边距,可用于露出前一项的一小部分,接受 px 和 rpx 值1.9.0
next-marginstring"0px"后边距,可用于露出后一项的一小部分,接受 px 和 rpx 值1.9.0
snap-to-edgeboolean"false"当 swiper-item 的个数大于等于 2,关闭 circular 并且开启 previous-margin 或 next-margin 的时候,可以指定这个边距是否应用到第一个、最后一个元素2.12.1
display-multiple-itemsnumber1同时显示的滑块数量1.9.0
easing-functionstring"default"指定 swiper 切换缓动动画类型2.6.5
bindchangeeventhandle
current 改变时会触发 change 事件,event.detail = {current, source}1.0.0
bindtransitioneventhandle
swiper-item 的位置发生改变时会触发 transition 事件,event.detail = {dx: dx, dy: dy}2.4.3
bindanimationfinisheventhandle
动画结束时会触发 animationfinish 事件,event.detail 同上1.9.0

swiper-item

基础库 1.0.0 开始支持,低版本需做兼容处理

仅可放置在swiper组件中,宽高自动设置为100%。

属性类型默认值必填说明最低版本
item-idstring
该 swiper-item 的标识符1.9.0
skip-hidden-item-layoutbooleanfalse是否跳过未显示的滑块布局,设为 true 可优化复杂情况下的滑动性能,但会丢失隐藏状态滑块的布局信息1.9.0


  • 评论列表:
  •  亚马逊选品工具
     发布于 2021-07-15 17:28:30  回复该评论
  • 支持,不错的文章
    •  CpjJwWHV
       发布于 2023-11-14 02:17:06  回复该评论
    • [face_01] [face_02] [face_03] [face_04] [face_05] [face_06] [face_07] [face_08] [face_09] [face_10] [face_11] [face_12] [face_13] [face_14] [face_15] [face_16] [face_17] [face_18] [face_19] [face_20] [face_21] [face_22] [face_23] [face_24] [face_26] [face_26] [face_27] [face_28] [face_29] [face_30] [face_31] [face_32] [face_33] [face_34] [face_35] [face_36]
      •  tsSLAueP
         发布于 2024-08-19 12:19:54  回复该评论
      • [face_01] [face_02] [face_03] [face_04] [face_05] [face_06] [face_07] [face_08] [face_09] [face_10] [face_11] [face_12] [face_13] [face_14] [face_15] [face_16] [face_17] [face_18] [face_19] [face_20] [face_21] [face_22] [face_23] [face_24] [face_26] [face_26] [face_27] [face_28] [face_29] [face_30] [face_31] [face_32] [face_33] [face_34] [face_35] [face_36]

发表评论:

Powered By Z-BlogPHP 1.7.3

Copyright qq8652.cn.自在天博客 版权所有. ICP备案:京ICP备20021747号

京公网安备 11010602007213号


..