Swiper

Cập nhật lần cuối:24/8/2026

import { Swiper } from "zmp-ui";

Dùng để hiển thị nhiều hình ảnh dưới dạng trượt ngang như banner, carousel,...

Ví dụ

Property	Type	Required	Description
autoplay	boolean	No	Thiết lập cơ chế tự động chuyển slide. (default: `false`)
afterChange	(currentIndex: number) => void	No	Callback được sau khi slider đã chuyển đến slide mới.
defaultActive	number	No	Index của slide bắt đầu khi slider được render.
dots	boolean	No	Hiển thị các chấm chuyển slide ở phía dưới slider. (default: `true`)
children	React.ReactNode	No	Chứa các `` component.
loop	boolean	No	Thiết lập cơ chế lặp lại các slide. Sau khi chuyển đến slide cuối cùng, slider sẽ quay lại slide đầu tiên. (default: `false`)
duration	number	No	Thời gian tự động chuyển giữa các slide (đơn vị: "ms"). Cần được sử dụng kết hợp với `autoplay`.
disableSwipe	boolean	No	Tắt cơ chế chuyển slide khi vuốt trên thiết bị di động. (default: `false`)

Property	Type	Required	Description
activeIndex	number	No	Index của slide hiện tại.
goTo	(slideIndex: number) => void	No	Chuyển đến một slide cụ thể.
next	() => void	No	Chuyển đến slide tiếp theo.
prev	() => void	No	Quay lại slide phía trước.

Property	Type	Required	Description
children	React.ReactNode	No	Nội dung cần được hiển thị trong slide.