Radio 单选框

使用

import { KRadio } from "@ksware/ksw-ux";

在一组备选项中进行单选

基础用法

单选框不应该有太多的可选项， 如果你有很多的可选项你应该使用选择框而不是单选框。

要使用 Radio 组件，只需要设置v-model绑定变量， 选中意味着变量的值为相应 Radio value属性的值， value可以是String、Number 或 Boolean。

自定义颜色

使用color属性可以自定义单选框的颜色。

禁用状态

disabled 属性可以用来控制单选框的禁用状态。

你只需要为单选框设置 disabled 属性就能控制其禁用状态。

单选框组

适用于在多个互斥的选项中选择的场景

结合k-radio-group元素和子元素k-radio可以实现单选组， 为 k-radio-group 绑定 v-model，再为 每一个 k-radio 设置好 label 属性即可， 另外，还可以通过 change 事件来响应变化，它会传入一个参数 value 来表示改变之后的值。

按钮样式

你可以让单选框看起来像一个按钮一样。

只需要添加button属性即可， 此外，还提供了 size 属性用来控制单选框的大小。

Radio API

Radio Props

参数名	描述	类型	默认值
model-value / v-model	选中项绑定值	string | number | boolean	-
value	单选框的值	string | number | boolean	-
label	单选框的 label， 如果未配置 value 属性， label 则作为 value 使用	string | number | boolean	-
size	radio尺寸	enum	'base'
disabled	是否禁用	boolean	false
border	是否显示边框	boolean	false
color	自定义填充颜色	string	#2882FF
button	是否显示按钮样式,建议配合 KRadioGroup 组件使用	boolean	false
name	原生name属性	string	-
strict 1.2.4	是否开启严格模式，为 true 时只有点击单选框时才能选中	boolean	false

Radio Slots

插槽名	描述	参数
default	默认插槽内容	-

RadioGroup API

RadioGroup Props

参数名	描述	类型	默认值
model-value / v-model	绑定值	string[] | number[]	[]
size	radio尺寸	enum	'base'
disabled	是否禁用	boolean	false
color	button 不为 true 时自定义填充颜色	string	#2882FF
button	是否显示按钮样式	boolean	false
text-color	按钮形式的 radio 激活时的文本颜色	string	-
fill	按钮形式的 radio 激活时的填充色和边框色	string	-
direction	复选框组元素标签	enum	'row'
strict 1.2.4	是否开启严格模式，为 true 时只有点击单选框时才能选中	boolean	false

RadioGroup Events

事件名	描述	类型
change	当绑定值变化时触发的事件	Function

RadioGroup Slots

插槽名	描述	参数
default	默认插槽内容	-