RadioGroup 单选框组
用于包裹并集中管理多个 <mu-radio> 互斥单选框的容器组件,支持纵向或横向排列布局。
代码示例
1. 基础用法
vue
<template>
<mu-radio-group v-model="selected" direction="horizontal" @change="onChange">
<mu-radio name="alipay" label="支付宝" />
<mu-radio name="wechat" label="微信支付" />
</mu-checkbox-group>
</template>
<script setup>
import { ref } from 'vue'
const selected = ref('wechat')
const onChange = (val) => console.log('当前选中:', val)
</script>API 属性说明 (Props)
| 参数名 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| v-model / modelValue | 当前已选中的子项 name 标识值 | String | Number | Boolean | - | '' |
| direction | 子单选框排列布局方向 | String | vertical | horizontal | 'vertical' |
事件说明 (Events)
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| update:modelValue | 双向绑定更改变 | (value: String | Number | Boolean) |
| change | 选中项改变时触发 | (value: String | Number | Boolean) |
插槽说明 (Slots)
| 插槽名 | 说明 |
|---|---|
| default | 子级单选框 <mu-radio> 容器插槽 |