DaLuoComponents

Appearance

字典选择与单选 (FDictSelect / FDictRadio) ​

基于 FinConfigProvider 全局上下文与 useDict Hook 打造的系统级数据字典解决方案。解决业务系统中频繁手动写 API 拉取下拉字典、手动转换键值对以及代码冗余的问题。

组件与命名规范：字典下拉组件名主推 FDictSelect，别名导出 FinDictSelect；字典单选组件名主推 FDictRadio，别名导出 FinDictRadio。useDict 是 Hook，不是组件，不提供 F*/Fin* 组件别名。

包含了：

  • FDictSelect (别名 FinDictSelect)：字典下拉选择组件
  • FDictRadio (别名 FinDictRadio)：字典单选框 / 按钮组组件
  • useDict：组合式 API，可在自定义业务代码中自由消费字典数据

示例展示 ​

字典下拉、单选与 Hook 消费 ​

支持根据 dict-type 零配置绑定全局字典，亦支持局部传参重写、button 按钮模式及 useDict 自由消费。

loading

表单 Schema 中标准注册 ​

FDictSelect 与 FDictRadio 已全量统一注册到表单组件库注册表中，通过 FDictSelect 或 FDictRadio 直接在 FormSchema 中声明使用：

ts
const schemas: FormSchema[] = [
  {
    field: 'accountType',
    label: '账户类型',
    component: 'FDictSelect', // 标准组件类型
    dictType: 'sys_account_type', // 关联字典编码
    required: true,
  },
  {
    field: 'status',
    label: '单据状态',
    component: 'FDictRadio', // 标准组件类型
    dictType: 'bill_status',
    componentProps: {
      button: true, // 渲染为按钮样式
    },
  },
]

FinDictSelect API 说明 ​

属性名类型默认值说明
dictTypestring-字典编码/类型（如 'sys_user_sex'），自动从 ConfigProvider 获取数据
optionsany[]-手动传入的数据列表（指定时将优先使用，覆盖 dictType）
fieldNamesDictFieldNames-局部字段映射配置（格式：{ label: 'name', value: 'code' }）
placeholderstring'请选择'占位提示文本
clearablebooleantrue是否允许清空选择
disabledbooleanfalse是否禁用组件
size'large' | 'default' | 'small'-组件尺寸

FinDictRadio API 说明 ​

属性名类型默认值说明
dictTypestring-字典编码/类型
optionsany[]-手动传入的数据列表
fieldNamesDictFieldNames-局部字段映射配置
buttonbooleanfalse是否渲染为 ElRadioButton 按钮外观样式
disabledbooleanfalse是否禁用组件
size'large' | 'default' | 'small'-组件尺寸

useDict Hook API 说明 ​

在 Setup 语法糖中直接使用 useDict：

ts
import { useDict } from '@axewo/fin-ui'

// options 为归一化后的 Ref<DictOption[]>
// loading 为异步加载状态 Ref<boolean>
const { options, loading } = useDict('sys_user_status')

返回值对象 ​

属性名类型说明
optionsRef<DictOption[]>自动经过字段映射归一化后的字典选项数组 ([{ label, value, ... }])
loadingRef<boolean>当使用 dict.loader 异步请求字典时的加载状态标记