import{c as t,o,B as a}from"./vendor.36ea9f7d.js";const d={class:"markdown-body"},r=a('

Radio 单选按钮

Radio 基本用法

通过 v-model 绑定值当前选中项的 label ，二者一致时 Radio 选中。

<nut-radio v-model="radioVal" :label="b">备选项1</nut-radio>\n
setup() {\n  return {\n    radioVal:"a",\n  };\n}\n

组合使用 Radio

<nut-radio v-model="radioVal" :label="1">备选项1</nut-radio>\n<nut-radio v-model="radioVal" :label="2">备选项2</nut-radio>\n
setup() {\n  return {\n    radioVal:"2",\n  };\n}\n

RadioGroup基本用法

<nut-radiogroup v-model="radioGroupVal">\n  <nut-radio label="a">备选项1</nut-radio>\n  <nut-radio label="b">备选项2</nut-radio>\n</nut-radiogroup>\n
setup() {\n  return {\n    radioGroupVal:"b",\n  };\n}\n

Radio 禁用

通过给 disabled 传布尔值 false ，可将组件禁用

<nut-radio :disabled="true" label="禁用">备选项1</nut-radio>\n

RadioGroup 整体禁用

<nut-radiogroup v-model="radioGroupVal" :is-animated="false">\n  <nut-radio label="a">备选项1</nut-radio>\n  <nut-radio label="b">备选项2</nut-radio>\n  <nut-radio label="c">备选项3</nut-radio>\n</nut-radiogroup>\n
setup() {\n  return {\n    radioGroupVal:"c",\n  };\n}\n

Radio 自定义尺寸

内置 small，base，large 三种规格供使用。

<nut-radio size="small">小号</nut-radio>\n<nut-radio size="base">默认</nut-radio>\n<nut-radio size="large">大号</nut-radio>\n

RadioGroup整体定义尺寸

内置 small，base，large 三种规格供使用。

<nut-radiogroup v-model="radioGroupVal" size="large">\n  <nut-radio label="1">备选项1</nut-radio>\n  <nut-radio label="2">备选项2</nut-radio>\n  <nut-radio label="3">备选项3</nut-radio>\n</nut-radiogroup>\n
setup() {\n  return {\n    radioGroupVal:"2",\n  };\n}\n

禁用动效

通过给 is-animated 传布尔值 false ，禁用自带动效

<nut-radio :is-animated="false" v-model="radioVal" label="a">备选项1</nut-radio>\n<nut-radio :is-animated="false" v-model="radioVal" label="b">备选项2</nut-radio>\n
setup() {\n  return {\n    radioVal: 'b',\n  };\n}\n

RadioGroup 禁用动效

<nut-radiogroup v-model="radioGroupVal" :is-animated="false">\n  <nut-radio label="a">备选项1</nut-radio>\n  <nut-radio label="b">备选项2</nut-radio>\n  <nut-radio label="c">备选项3</nut-radio>\n</nut-radiogroup>\n
setup() {\n  return {\n    radioGroupVal: 'c',\n  };\n}\n

新增自定义class

<nut-radio class="my-radio">备选项</nut-radio>\n

RadioGroup 也支持新增自定义class

Prop

Radio

字段说明类型默认值
v-model当前选中项的标识符，与label值一致时呈选中状态任意类型-
label标识符，与v-model值一致时呈选中状态任意类型-
size尺寸，可选值small/base/largeStringbase
disabled是否禁用Booleanfalse
is-animated是否需要动效Booleantrue

RadioGroup

字段说明类型默认值
v-model当前选中项的标识符，与label值一致时呈选中状态String、Number、Boolean-
size尺寸，可选值small/base/largeStringbase
disabled是否禁用Booleanfalse
is-animated是否需要动效Booleantrue

Event

字段说明回调参数
change值变化时触发当前选中项值（label）【设置label后有值、默认为空】
',41),l={expose:[],setup:a=>(a,l)=>(o(),t("div",d,[r]))};export default l;