Loader 加载器 - Docs - Artefact

Loader 加载器

Feedback

展示型

简介

一个用于管理 Spinner 及其关联文字视觉状态的工具组件。

用法

Loading data...

import { Loader, Spinner } from "../components/ui";

export default function MyPage() {
  return <Loader text="Loading data..." />;
}

自定义 Spinner 与位置

import { Loader, Spinner } from "../components/ui";

export default function MyPage() {
  return (
    <Loader
      spinner={<Spinner size="lg" colorPalette="blue" />}
      spinnerPlacement="end"
    >
      Please wait
    </Loader>
  );
}

CMS 页面构建器

该组件可作为 loader 区块在页面构建器（content/pages/*.json）中使用 —— CMS 的 text 字段直接映射到 Loader 自身的 text 属性：

{
  "type": "loader",
  "text": "Checking availability...",
  "spinnerPlacement": "start"
}

属性

属性	类型	说明
`children`	`any`	与 spinner 一起渲染的文本内容。
`spinner`	`Child`	自定义 spinner 元素。默认 `<Spinner size="inherit" />`。
`text`	`Child`	用于文本内容的替代属性。