Skip to content

KRadio

Single selection among multiple options.

Install

bash
pnpm add @ikun-ui/radio
bash
yarn add @ikun-ui/radio
bash
npm install @ikun-ui/radio

Basic usage

Radio should not have too many options. Otherwise, use the Select component instead.

Disabled radio

Set the disabled attribute.

Sizes

Add size attribute to change the size of Radio. It supports sm, md and lg.

Radio group

In fact, more often we use radioGroup to implement radio selection.

Radio Props

NameTypeDefaultDescription
labelstring-Label of the Radio
disabledbooleanfalseWhether the Radio is disabled
valuebooleanfalseBinding value
uidstring-The unique value of the radio component, must be passed when wrapped by radioGroup
sizesm | md | lgmdSize of radio.
clsstring-Additional class
attrsRecord<string, string>{}Additional attributes

Radio Events

NameDescriptionType
updateValueEvent fired when the value is changes(value: Event)=> void

Radio Group Props

NameTypeDefaultDescription
disabledbooleanfalseWhether the radioGroup is disabled
valuestring | number-Binding value,Its elements must be consistent with the uid of the radio component
sizesm | md | lgmdsize of radio.
clsstring-Additional class
attrsRecord<string, string>{}Additional attributes

Radio Group Events

NameDescriptionType
updateValueEvent fired when the value is changes(value: CustomEvent)=> void

Radio Group Slots

NameDescription
defaultPlease pass in the radio component

MIT Licensed