vant/swipe.md at 05abf0d50954c455957276bc682b09d69889d383

mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00

[new feature] Swipe add 'initialSwipe' prop (#279 )

* [bugfix] CouponList always show empty info

* [bugfix] add click feedback of buttons in components

* [Doc] add custom theme document

* [new feature] Notice bar support more props

* [bugfix] PullRefresh test cases

* [bugfix] unused NoticeBar style

* [bugfix] Swipe width calc error

* [Doc] english document of all action components

* [Doc] change document site path to /zanui/vant

* [Doc] fix

* [bugfix] uploader style error

* [bugfix] tabs document demo

* [new feature] Cell support vue-router target route

* [bugfix] add cell test cases

* update yarn.lock

* [bugfix] Tabbar cann't display info when use icon slot

* [Doc] update document title

* [bugfix] Dialog should reset button text when showed

* [new feature] CouponList add showCloseButton prop

* [new feature] Swipe add 'initialSwipe' prop

2017-11-03 04:50:58 -05:00

1.9 KiB

Raw Blame History

Swipe

Install

import { Swipe, SwipeItem } from 'vant';

Vue.component(Swipe.name, Swipe);
Vue.component(SwipeItem.name, SwipeItem);

Usage

Basic Usage

Use autoplay prop to set autoplay interval

:::demo Basic Usage

<van-swipe :autoplay="3000">
  <van-swipe-item>1</van-swipe-item>
  <van-swipe-item>2</van-swipe-item>
  <van-swipe-item>3</van-swipe-item>
  <van-swipe-item>4</van-swipe-item>
</van-swipe>

:::

Image Lazyload

Use Lazyload component to lazyload image

:::demo Image Lazyload

<van-swipe>
  <van-swipe-item v-for="(image, index) in images" :key="index">
    <img v-lazy="image" />
  </van-swipe-item>
</van-swipe>

export default {
  data() {
    return {
      images: [
        'https://img.yzcdn.cn/1.jpg',
        'https://img.yzcdn.cn/2.jpg'
      ]
    }
  }
}

:::

API

Attribute	Description	Type	Default	Accepted Values
autoplay	Autoplay interval (ms)	`Number`	-	-
duration	Animation duration (ms)	`Number`	`500`	-
showIndicators	Whether to show indocators	`Boolean`	`true`	-
initialSwipe	Index of initial swipe, start from 0	`Number`	`0`	-

Event

Event	Description	Attribute
change	Triggered when current swipe change	index: index of current swipe

1.9 KiB Raw Blame History