Search
Spin
A spinner for displaying loading state of a page or a section.
When to use
When part of the page is waiting for asynchronous data or during a rendering process, an appropriate loading animation can effectively alleviate users' inquietude.
Basic
A simple loading status.
Size
A small Spin is used for loading text, default sized Spin for loading a card-level block, and large Spin used for loading a page.
Inside a container
Spin in a container.
Embedded mode
Embedding content into Spin will set it into loading state.
Delay
Specifies a delay for loading state. If spinning ends during delay, loading status won't appear.
API
| Property | Description | Type | Default |
|---|---|---|---|
delay | specifies a delay in milliseconds for loading state (prevent flush) | number (milliseconds) | - |
indicator | React node of the spinning indicator | ReactNode | - |
size | size of Spin, options: small, default and large | string | default> |
spinning | whether Spin is spinning | boolean | true |
tip | customize description content when Spin has children | string | - |
wrapperClassName | className of wrapper when Spin has children | string | - |