Skip to content

API 概览

本部分提供了所有 XCloud UI 包的详细 API 文档。

@xcloud/ui-core

在所有平台上工作的核心 UI 组件。

查看核心 API 文档 →

@xcloud/ui-mobile

为触摸界面优化的移动特定组件。

查看移动 API 文档 →

@xcloud/ui-web

网络特定组件和布局。

查看网络 API 文档 →

常见模式

属性约定

所有组件遵循这些约定:

  • className - 附加的 CSS 类
  • style - 内联 CSS 样式
  • children - 子元素
  • data-* - 自定义数据属性

事件处理器

事件处理器遵循 React 命名:

  • onClick - 点击事件
  • onChange - 变化事件
  • onFocus - 焦点事件

TypeScript 类型

所有组件导出它们的属性类型:

tsx
import type { ButtonProps } from '@xcloud/ui-core'
import type { MobileTabbarProps } from '@xcloud/ui-mobile'

工具函数

CSS 变量

组件使用 CSS 变量进行主题设置:

css
:root {
  --xcloud-primary: #646cff;
  --xcloud-radius: 8px;
  --xcloud-spacing: 16px;
}

助手函数

导入工具函数:

tsx
import { cn, createStyles } from '@xcloud/ui-core/utils'

版本兼容性

ReactTypeScript
ui-core18+5.0+
ui-mobile18+5.0+
ui-web18+5.0+

贡献

发现了一个问题或想要贡献?查看我们的 GitHub 仓库

最后更新于:

基于 MIT 许可发布