🌏 Translated with the assistance of DeepSeek and ChatGPT
Carousel
A component that automatically scrolls its content, supporting seamless loop playback.
Basic Usage
Carousel starts scrolling automatically after mounting. Use the speed prop to set the scrolling speed.
Hide source code
Auto Fill
After setting the autoFill property, the Carousel component will make the content fill the entire viewport.
Hide source code
Manual Control
Carousel exposes the resume, pause, and reset methods, used to resume scrolling, pause scrolling, and reset the scroll position while re-measuring the dimensions respectively.
Hide source code
API
CarouselProps
| Attribute | Type | Optional | Default | Description | Version |
|---|---|---|---|---|---|
| autoFill | boolean | True | false | Whether to automatically fill the content based on the viewport width and remove the spacing. | 0.2.0 |
| speed | number | True | 50 | The scrolling speed of Carousel. | 0.2.0 |
CarouselSlots
| Slot | Parameter | Description | Version |
|---|---|---|---|
| default | | The content of Carousel. | 0.2.0 |
CarouselExpose
| Attribute | Type | Optional | Default | Description | Version |
|---|---|---|---|---|---|
| resume | () => void | False | | Resume the scrolling of Carousel. | 0.2.0 |
| pause | () => void | False | | Pause the scrolling of Carousel. | 0.2.0 |
| reset | () => void | False | | Reset the scroll position of Carousel and re-measure the dimensions. | 0.2.0 |
| measure | () => void | False | | Re-measure the dimensions of Carousel. | 0.2.0 |