radio.vue 796 B

1234567891011121314151617181920
  1. <template>
  2. <div class="input radio" :style="{ width, height }">
  3. <input :name="name" :disabled="disabled" :id="id" type="radio" class="replace-input" :checked="props.modelValue" @change="ev => emit('update:modelValue', ev.target.checked)" />
  4. <span class="replace"></span>
  5. </div>
  6. <label class="label" v-if="props.label || props.icon" :for="id">
  7. <Icon :type="props.icon" :tip="props.tip" v-if="props.icon" />
  8. {{ props.label }}
  9. </label>
  10. </template>
  11. <script setup lang="ts">
  12. import Icon from '../icon'
  13. import { radioPropsDesc } from './state'
  14. import { randomId } from '../../utils'
  15. import { defineProps, defineEmits } from 'vue'
  16. const props = defineProps(radioPropsDesc)
  17. const emit = defineEmits(['update:modelValue'])
  18. const id = randomId(4)
  19. </script>