Important: This documentation covers Yarn 1 (Classic).
For Yarn 2+ docs and migration guide, see yarnpkg.com.

Package detail

@mas.io/mas-fullscreen-swiper

bingjian.guo12ISC0.0.6

mas-fullscreen-swiper 的组件描述

readme

安装

tnpm install --save @alipay/mas-fullscreen-swiper

组件介绍

行业小程序租房房源图片组件,结合swiper的组件样式,针对支付宝行业的各个不同场景进行定制化开发,满足业务需求。

API

属性 必填 参数类型 参数说明 默认值 示例
swiperItems Array 滑动的图片数组 [] ['example.png']
height Number 图片高度 422 422
indicatorDots Boolean 是否显示指示点 true true
autoplay Boolean 是否自动播放 false false
interval Number 自动切换时间间隔,毫秒为单位 3000 3000
duration Number 滑动动画时长,默认为毫秒 100 100
circular 是否启用无限滑动 String true true
acceleration Boolean 当开启时,会根据滑动速度,连续滑动多屏 true true
showNum 是否展示右下角数字 非必填 true true
previewImg 点击图片是否进入预览模式 非必填 false true
onTapImg 点击图片后的回调函数 非必填 - -

其中swiperItems是数组,swiperItems里面的每一项都是图片的链接。

在小程序中使用

{
  "usingComponents": {
    "mas-fullscreen-swiper": "@alipay/mas-fullscreen-swiper/es/index"
  }

}

在 page.axml 中引用组件

<!-- 页面使用方式 -->
 <mas-fullscreen-swiper
    swiperItems="{{ swiperItems }}" 
    circular="{{ circular }}"
    indicatorDots="{{indicatorDots}}"
    autoplay="{{autoPlay}}"
    interval="{{interval}}"
    duration="{{duration}}"
    circular="{{circular}}"
    acceleration="{{acceleration}}"
    height="{{height}}"
    previewImg="{{previewImg}}"
    onTapImg="onTapImgView"
  />

Badges

TNPM version TNPM downloads [![install size][install-size-image]][install-size-url]