ASpinner
ASpinner renders a rotating icon — a simple spinning loader. Pass an icon prop (any Iconify name) to swap the default spinner, or leave it empty for the built-in one.
Import
import { Spinner } from '@any-design/anyui/vue';
// React: import { Spinner } from '@any-design/anyui/react';
// Svelte: import { Spinner } from '@any-design/anyui/svelte';Basic usage
<template>
<ASpinner />
</template>Examples
Custom icon
Pass any Iconify icon name to spin it instead of the default.
<template>
<ASpinner icon="ri:loader-4-line" />
</template>Inline in a button
Like ALoading, the spinner works well inside a button to indicate an in-flight action.
<template>
<AButton type="primary" disabled>
<ASpinner icon="ri:loader-4-line" />
<span>Loading</span>
</AButton>
</template>Props
| Prop | Type | Default | Description |
|---|---|---|---|
icon |
String | IconifyIcon | ‘’ | The icon to spin (defaults to the built-in spinner). |
ASpinner
ASpinner 渲染一个旋转的图标 —— 简单的旋转加载动画。通过 icon 属性（任意 Iconify 图标名）可替换默认图标，留空则使用内置图标。
引入
import { Spinner } from '@any-design/anyui/vue';
// React: import { Spinner } from '@any-design/anyui/react';
// Svelte: import { Spinner } from '@any-design/anyui/svelte';基础用法
<template>
<ASpinner />
</template>示例
自定义图标
传入任意 Iconify 图标名，旋转它以替代默认图标。
<template>
<ASpinner icon="ri:loader-4-line" />
</template>内联在按钮中
与 ALoading 类似，spinner 适合放在按钮内表示操作进行中。
<template>
<AButton type="primary" disabled>
<ASpinner icon="ri:loader-4-line" />
<span>加载中</span>
</AButton>
</template>属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
icon |
String | IconifyIcon | ‘’ | 旋转的图标（默认使用内置的 spinner）。 |