Skip to content

Radio 单选框

在一组备选项中进行单选。

基础用法

默认在布尔值之间切换

查看代码
vue
<template>
  <e-radio v-model="value" />
</template>

<script setup lang="ts">
import { ref, watchEffect } from 'vue'

const value = ref(false)

watchEffect(() => {
  console.log(value.value)
})
</script>

指定【标签】和【选中状态的值】

查看代码
vue
<template>
  <e-radio v-model="value" label="选项一" value="value1" />
</template>

<script setup lang="ts">
import { ref, watchEffect } from 'vue'

const value = ref('')

watchEffect(() => {
  console.log(value.value)
})
</script>

单选框组

查看代码
vue
<template>
  <e-radio-group v-model="value" :options />
</template>

<script setup lang="ts">
import { ref, watchEffect } from 'vue'

const value = ref('')

const options = [
  { label: '选项一', value: 'value1', disabled: false },
  { label: '选项二', value: 'value2', disabled: false },
  { label: '选项三', value: 'value3', disabled: false }
]

watchEffect(() => {
  console.log(value.value)
})
</script>