数据组件

字典单选框组 AsamDictRadio

在单选框组上管理字典选项、重载和请求取消。

字典单选框组 ​

在单选框组上管理字典选项、重载和请求取消。

基础用法 ​

示例通过本地 provider 获取字典,支持模型更新、暂停与重载。所有请求都留在演示内部。

基础场景的原始值模型保持 ready/running,单选更新会替换上一项;对象模式则保留规范化选项及来源raw。两种存储语义由 valueMode 明确选择,单选不接收集合存储策略。

本地字典与生命周期

展开源码

数据来源与覆盖 ​

dictType 与 dataSource 只选一种;dataSource 使用 defineAsamDictSource 创建,不能再传 dictValueType。 完整说明。

单选值模式的模型为标量或 null;valueMode=object 时使用规范化 AsamOption。单选框组由组件入口确定单选职责,没有 multiple 或 multipleValueMode 配置。

生命周期、事件与实例 ​

active=false 暂停请求并保留上次成功数据;reload({ force: true }) 请求新数据,cancel() 取消当前请求。 完整说明。

immediate 控制初始化是否请求,active 控制请求是否启用。初始化和默认值以本页自动 API 的原始来源为准。

插槽与基础能力 ​

option 插槽接收 { option },option.raw 保留原始对象;default 插槽沿用基础选项布局。实例仅增加数据重载与取消,不声明基础选择器的 focus/blur。

本站继承关系 ​

  • 单选框组:适用的基础展示、交互与公开 API。

本页数据来源、模型、事件和实例的覆盖规则优先;本站链接不扩大本组件公开契约。尺寸使用基础组件的 ASAM 尺寸规则,示例使用 default。

字典刷新与示例 Provider ​

强制重载会先调用 provider.dict.refresh,再重新读取字典。示例 provider 同时提供 get 和 refresh,并检查请求取消信号;使用固定字典数据,不连接真实后端。宿主接入时应在 refresh 中实现实际缓存更新。

连续按钮与对象模型 ​

type="button" 将选项排列为连续拼接的按钮;尺寸为 large / big / default / small。 完整说明。

四个公开事件在完整示例的事件记录中可检查:update:modelValue 与 change 保留具体单项/集合模型,success 保留规范化选项及来源 raw,error 保留错误种类和消息。失败恢复和取消继续保留调用方模型;取消不伪装为 error。

option 插槽保留具体规范化项和 option.raw.id;default 插槽无 scope 参数,可替换选项布局。完整示例可切换自定义默认内容并恢复来源选项;默认内容替代选项布局,切换本身不修改模型,恢复后仍保留原始实体。

连续按钮、对象模型与四档尺寸

展开源码

局部请求错误插槽 ​

可选 error 插槽仅在当前请求错误存在时调用,接收只读 { error, stale, retry }。 完整说明。

retry 不接收参数,返回强制 reload 的 Promise,并遵守取消和卸载规则。 完整说明。

提供该插槽时,自有内容替换整个默认局部错误区;返回空内容也表示主动替换。 未提供时继续显示原错误文字、过期提示和默认重试按钮。无 error 的单独 stale 状态 不调用此插槽;empty、loading 和其他基础插槽继续使用原作用域。

以下完整 TS/JS 示例先制造失败,再等待插槽 retry 的返回结果;成功后可再次制造 更新失败,观察旧结果与模型保留。每次挂载使用独立子 app 和本地 provider。

局部错误定制、等待重试与过期恢复

展开源码

API

属性 AsamDictRadioProps

属性名说明类型默认值
ariaLabel—string | undefined—
id—string | undefined—
disabled—boolean | undefined—
size—enum"large" | "big" | "default" | "small"完整类型:AsamControlSize | undefined—
fill—string | undefined—
type—enum"button" | "radio"完整类型:"button" | "radio" | undefined—
name—string | undefined—
modelValue—V | null | undefined | AsamChoiceOption<V, I> | null | undefined—
textColor—string | undefined—
valueMode—enum"value" | "object"完整类型:"value" | undefined | "object"—
validateEvent—boolean | undefined—
immediate—boolean | undefined—
active—boolean | undefined—
dictType—string | undefined—
dictValueType—enum"string" | "number" | "boolean"完整类型:AsamDictValueType | undefined | undefined—
dataSource—undefined | AsamOptionsSource<V, I, "dict">—

事件 AsamRadioDataEmits

属性名说明类型默认值
success—[data: readonly AsamOption<V, I>[]]—
error—[error: AsamDataError]—
update:modelValue—[value: V | AsamOption<V, I> | null]—
change—[value: V | AsamOption<V, I> | null]—

插槽 AsamAsyncChoiceSlots

属性名说明类型默认值
default—(() => unknown) | undefined—
option—((scope: { option: AsamOption<V, I>; }) => unknown) | undefined—
error替换本地错误区域;重试返回现有强制重新加载的 Promise。(AsamAsyncChoiceSlots<V, I>)["error"]—

实例方法与状态 AsamAsyncChoiceExpose

属性名说明类型默认值
reload—(options?: { readonly force?: boolean; }) => Promise<AsamReloadResult<readonly AsamOption<V, I>[]>>—
cancel—() => void—

用法与契约补充说明 ​

数据来源与覆盖 ​

dictType 与 dataSource 只选一种;dataSource 使用 defineAsamDictSource 创建,不能再传 dictValueType。短来源的 dictValueType 可将字典值转换为 string、number 或 boolean。应用通过 provideAsamData 注入 dict.get,演示在独立子应用中使用本地字典,切换语言或离开时卸载。

生命周期、事件与实例 ​

active=false 暂停请求并保留上次成功数据;reload({ force: true }) 请求新数据,cancel() 取消当前请求。success 返回规范化选项数组,error 返回 AsamDataError;旧成功数据更新失败时组件显示过期状态。reload 的 status 为 success、error 或 cancelled;不能把取消当作成功。

连续按钮与对象模型 ​

type="button" 将选项排列为连续拼接的按钮;尺寸为 large / big / default / small。完整示例保留数字值 0 和 option.raw,演示停用选项、加载失败后保留模型、恢复与取消慢请求。对象由组件规范化,调用方不手工拼接标签。Radio 只承担单选;不接收 Checkbox 的 min/max 或 tag。

局部请求错误插槽 ​

可选 error 插槽仅在当前请求错误存在时调用,接收只读 { error, stale, retry }。 error 与本实例 error 事件中的 AsamDataError 为同一对象,保留 cause、kind、 message 与 notified;渲染插槽不会再次通知 provider。stale 表示保留的数据已过期。

更多参数与事件说明 ​

局部请求错误插槽 ​

retry() 不接收参数,直接返回现有 reload({ force: true }) 的 Promise,结果为 AsamReloadResult<readonly AsamOption<V, I>[]> 的 success、error 或 cancelled 分支。 重试遵守 active、当前来源、取消和卸载规则,不改写模型。字典强刷沿用 provider 的 refresh 后 get;缺少 refresh 仍是原配置错误。

继承能力

本入口的独有 API 见上表,基础能力见本站对应页面。

参数与事件补充说明

组合契约按分支生效;请同时查看公开类型。

参数与事件说明

ariaLabel

必填:否;声明来源:上游声明。

id

必填:否;声明来源:ASAM 声明。

disabled

必填:否;声明来源:ASAM 声明。

disabled 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:false / true

size

必填:否;声明来源:ASAM 声明。

size 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:"large" / "big" / "default" / "small"

fill

必填:否;声明来源:上游声明。

默认值与来源
未知 / 未声明

固定上游源码默认表达式:''(2.14.7;源码事实,未作为 ASAM 运行实测)

type

必填:否;声明来源:ASAM 声明。

type 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:"button" / "radio"

name

必填:否;声明来源:ASAM 声明。

modelValue

必填:否;声明来源:ASAM 声明。

modelValue 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

  • modelValue.label: string — 数据 / provider 协议
  • modelValue.value: V — 数据 / provider 协议
  • modelValue.disabled: boolean | undefined — 数据 / provider 协议

    枚举:false / true

  • modelValue.raw: I — 数据 / provider 协议
  • modelValue.children: readonly AsamOption<V, I>[] | undefined — 数据 / provider 协议
textColor

必填:否;声明来源:上游声明。

默认值与来源
未知 / 未声明

固定上游源码默认表达式:''(2.14.7;源码事实,未作为 ASAM 运行实测)

valueMode

必填:否;声明来源:ASAM 声明。

valueMode 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:"value"

枚举:"object"

validateEvent

必填:否;声明来源:ASAM 声明。

validateEvent 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:false / true

immediate

必填:否;声明来源:数据 / provider 协议。

immediate 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:false / true

active

必填:否;声明来源:数据 / provider 协议。

active 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:false / true

dictType

必填:否;声明来源:数据 / provider 协议。

dictValueType

必填:否;声明来源:数据 / provider 协议。

dictValueType 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

枚举:"string" / "number" / "boolean"

dataSource

必填:否;声明来源:数据 / provider 协议。

dataSource 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

  • dataSource.kind: "dict" — 数据 / provider 协议

    枚举:"dict"

  • dataSource.__@sourceBrand@58165: { readonly value: V; readonly raw: I; } — 数据 / provider 协议
    • dataSource.__@sourceBrand@58165.value: V — 数据 / provider 协议
    • dataSource.__@sourceBrand@58165.raw: I — 数据 / provider 协议
AsamDictRadioProps 公开类型视图
ts
import type { AsamDictRadioProps, AsamValue, AsamRecord, AsamChoiceRuntimeProps, AsamControlSize, AsamDictValueType, AsamOptionsSource, AsamChoiceOption, AsamOption } from '@asam-ui/ui';

type PublicMember<T, K extends PropertyKey> = T extends unknown ? K extends keyof T ? T[K] : never : never;

// AsamDictRadioProps
type PublicContract<V extends AsamValue = AsamValue, I extends object = AsamRecord> = AsamDictRadioProps<V, I>;

参数与事件说明

success

必填:是;声明来源:数据 / provider 协议。

error

必填:是;声明来源:数据 / provider 协议。

update:modelValue

必填:是;声明来源:数据 / provider 协议。

change

必填:是;声明来源:数据 / provider 协议。

AsamRadioDataEmits 公开类型视图
ts
import type { AsamRadioDataEmits, AsamValue, AsamOption, AsamDataError } from '@asam-ui/ui';

// AsamRadioDataEmits
type PublicContract<V extends AsamValue = AsamValue, I extends object = object> = {
	"success": [data: readonly AsamOption<V, I>[]];
	"error": [error: AsamDataError];
	"update:modelValue": [value: V | AsamOption<V, I> | null];
	"change": [value: V | AsamOption<V, I> | null];
};

参数与事件说明

default

必填:否;声明来源:数据 / provider 协议。

default 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数:(): unknown

option

必填:否;声明来源:数据 / provider 协议。

option 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数:(scope: { option: AsamOption<V, I>; }): unknown

error

必填:否;声明来源:数据 / provider 协议。

error 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数:(scope: Parameters<Extract<NonNullable<(AsamAsyncChoiceSlots<V, I>)["error"]>, (...args: never[]) => unknown>>[0]): unknown

AsamAsyncChoiceSlots 公开类型视图
ts
import type { AsamAsyncChoiceSlots, AsamValue, AsamOption, AsamDataError, AsamReloadResult } from '@asam-ui/ui';

// AsamAsyncChoiceSlots
type PublicContract<V extends AsamValue = AsamValue, I extends object = object> = {
	"default"?: (() => unknown) | undefined;
	"option"?: ((scope: { option: AsamOption<V, I>; }) => unknown) | undefined;
	"error"?: (AsamAsyncChoiceSlots<V, I>)["error"];
};

参数与事件说明

reload

必填:是;声明来源:数据 / provider 协议。

reload 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数:(options?: { readonly force?: boolean; } | undefined): Promise<AsamReloadResult<readonly AsamOption<V, I>[]>>

cancel

必填:是;声明来源:数据 / provider 协议。

cancel 参数与事件数据

下列为声明可读视图;可导入类型以公开类型视图为准。分支条件与父属性一致。

事件参数:(): void

AsamAsyncChoiceExpose 公开类型视图
ts
import type { AsamAsyncChoiceExpose, AsamValue, AsamRecord, AsamOption, AsamReloadResult } from '@asam-ui/ui';

// AsamAsyncChoiceExpose
type PublicContract<V extends AsamValue = AsamValue, I extends object = AsamRecord> = {
	"reload": (options?: { readonly force?: boolean; }) => Promise<AsamReloadResult<readonly AsamOption<V, I>[]>>;
	"cancel": () => void;
};

搜索文档

Tab 选择结果 Enter 打开 Esc 关闭