Skip to content

Radio Group

单选组运行时:Group 持有 value,Item 表达选项,Indicator 渲染选中标记。

运行时

状态契约由 @varo-ui/headless 提供;渲染 Parts 分别来自 @varo-ui/h5/primitives@varo-ui/weapp/primitives

演示

安装包@varo-ui/headless

安装

bash
pnpm add @varo-ui/headless @varo-ui/h5
# 或
pnpm add @varo-ui/headless @varo-ui/weapp

基础用法

通过上方演示面板切换 H5 实时预览,以及小程序运行时契约/代码。

禁用选项

RadioItem 上设置 disabled,可保留组级 value 契约的同时屏蔽单个选项。

Parts

Part作用
RadioGroup组级 value 与上下文
RadioItem单个选项
RadioIndicator选中指示器

Props

RadioGroup

Prop类型默认值描述
valuestring | number | undefinedundefined受控选中值
defaultValuestring | numberundefined非受控初始值
disabledbooleanfalse整组禁用
asstring'div'根节点标签

RadioItem

Prop类型默认值描述
valuestring | number必填选项值
disabledbooleanfalse选项禁用
asstring'button'选项节点标签

Events

EventPayload描述
update:valuestring | number受控同步选中值
valueChangestring | number选中值变化

无障碍

  • 组级 value 决定当前选中项。
  • 禁用 Item 不可被选中。
  • Indicator 只反映状态。

平台说明

  • H5 与小程序共用 value/disabled 契约。
  • 小程序侧键盘焦点由页面管理。

相关文档