ui-form-radio-tag 标签式单选框组件

版本：v2.3.11

标签式单选框组件用于以标签形式展示的单选框，支持自定义样式和类型

基本使用

<template>
  <div class="form-radio-tag-demo">
    <ui-form-radio-tag v-model="checkedValue">
      <ui-form-radio-tag-item value="1" label="选项1" />
      <ui-form-radio-tag-item value="2" label="选项2" />
      <ui-form-radio-tag-item value="3" label="选项3" />
    </ui-form-radio-tag>
    <p>当前选中：{{ checkedValue }}</p>
  </div>
</template>

<script setup>
import { ref } from 'vue';
const checkedValue = ref('1');
</script>

<style scoped>
.form-radio-tag-demo {
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
</style>

Props

FormRadioTag

参数	类型	默认值	说明
modelValue	String/Number/Boolean	-	当前选中的
disabled	Boolean	false	是否禁用所有标

FormRadioTagItem

参数	类型	默认值	说明
value	String/Number/Boolean	-	标签
label	String	-	标签文本
disabled	Boolean	false	是否禁用该标
type	String	'default'	标签类型，可选值：default、primary、success、warning、danger

Events

事件	说明	回调参数
change	选中值变化时触发	(value: String/Number/Boolean) 当前选中的

在线演示

扫码或点击链接在手机上查看完整演示

https://shadow-ui3-demo.nooko.cn/#/pages/form/form-radio-tag/form-radio-tag