#公共组件

NocoBase client v2 内置了一批公共组件。写插件页面、设置页或表单时，可以直接使用这些组件，复用 NocoBase 已经准备好的 UI 和交互。

#快速索引

#使用方式

在客户端插件中按需引入组件，然后像普通 React 组件一样使用：

import { RemoteSelect, Table } from '@nocobase/client-v2';

function SettingsPage() {
  return (
    <>
      <RemoteSelect request={loadOptions} />
      <Table rowKey="id" columns={columns} dataSource={records} />
    </>
  );
}

#选用建议

默认用 React + Antd 写页面就行。遇到下面这些 NocoBase 插件里的高频场景时，再优先查这里的组件：

• 设置页里要打开 drawer / dialog 表单
• 表单字段需要插入变量、编辑 JSON、输入文件大小或支持扫码
• 列表页需要 Collection 筛选或拖拽排序
• 需要使用 NocoBase 统一图标入口

如果只是普通输入框、按钮、提示信息，直接用 Antd 组件更直接。

#相关链接

• Component 组件开发 — 普通 React 组件的写法
• Context 常用能力 — 在组件里调用 API、国际化、路由等能力
• FlowEngine — 需要可视化配置时再使用 FlowModel