Swiper

Swiper view container, often used for banner carousels.

Code examples

Slide 1

Slide 2

Slide 3

Slide 4

Image carousel

Autoplay, indicator dots, and circular mode

<m-swiper indicator-dots autoplay interval="3000" circular
  style="height:180px">
  <m-swiper-item>
    <div style="background:#6366F1;">Slide 1</div>
  </m-swiper-item>
  <m-swiper-item>
    <div style="background:#10B981;">Slide 2</div>
  </m-swiper-item>
</m-swiper>

API

Swiper

Swiper props

属性	说明	类型	默认值
indicator-dots	Show page indicator dots	boolean	false
autoplay	Autoplay slides	boolean	false
interval	Autoplay interval (ms)	number	5000
duration	Slide transition duration (ms)	number	500
current	Current slide index	number	0
circular	Enable infinite loop	boolean	false
vertical	Vertical swiping	boolean	false

Swiper events

属性	说明	类型	默认值
change	Fires when the active slide changes	{ current }	-
animationfinish	Fires when the transition ends	{ current }	-