Radio 單選鈕

單獨使用（v-model 符合自身 value）或成組使用（LhRadioGroup 管理選中值）。

單選鈕

<template>
  <div class="demo-col" style="gap: 18px">
    <div>
      <LhRadioGroup v-model="style" name="painting-style">
        <LhRadio label="工筆" value="gongbi" />
        <LhRadio label="寫意" value="xieyi" />
        <LhRadio label="潑墨" value="pomo" disabled />
      </LhRadioGroup>
    </div>
    <div>
      <LhRadioGroup v-model="style" disabled>
        <LhRadio label="工筆" value="gongbi" />
        <LhRadio label="寫意" value="xieyi" />
      </LhRadioGroup>
      <p class="demo-note">整組 disabled</p>
    </div>
    <div class="demo-row" style="gap: 20px; flex-wrap: wrap; align-items: center">
      <LhRadioGroup v-model="style" size="small">
        <LhRadio label="工筆" value="gongbi" />
      </LhRadioGroup>
      <LhRadioGroup v-model="style" size="large">
        <LhRadio label="工筆" value="gongbi" />
      </LhRadioGroup>
    </div>
    <div>
      <LhRadio v-model="standalone" label="獨立單選（value 透傳）" :value="true" />
      <p class="demo-note">當前畫風：{{ style }}；獨立值：{{ String(standalone) }}</p>
    </div>
  </div>
</template>

<script>
export default {
  data: () => ({ style: 'xieyi', standalone: false }),
}
</script>

Radio Props

屬性	說明	類型	預設值
v-model	選中取值（model: modelValue/input）	unknown	—
value	本單選鈕取值	unknown	—
label	文案（或用預設插槽）	string	—
disabled / size / name	—	—	—

RadioGroup Props

屬性	說明	類型	預設值
v-model	組選中值	unknown	—
disabled / size / name	對子項生效	—	—

Events

事件	說明	回呼參數
input	v-model 事件	—
change	選中值變化時觸發	(value)

disabled 狀態下 change 被攔截。