basic-usage.vue 1.1 KB

12345678910111213141516171819202122232425262728293031323334
  1. <template>
  2. <div class="mb-2 flex items-center text-sm">
  3. <el-radio-group v-model="radio1" class="ml-4">
  4. <el-radio label="1" size="large">Option 1</el-radio>
  5. <el-radio label="2" size="large">Option 2</el-radio>
  6. </el-radio-group>
  7. </div>
  8. <div class="my-2 flex items-center text-sm">
  9. <el-radio-group v-model="radio2" class="ml-4">
  10. <el-radio label="1">Option 1</el-radio>
  11. <el-radio label="2">Option 2</el-radio>
  12. </el-radio-group>
  13. </div>
  14. <div class="my-4 flex items-center text-sm">
  15. <el-radio-group v-model="radio3" class="ml-4">
  16. <el-radio label="1" size="small">Option 1</el-radio>
  17. <el-radio label="2" size="small">Option 2</el-radio>
  18. </el-radio-group>
  19. </div>
  20. <div class="mb-2 flex items-center text-sm">
  21. <el-radio-group v-model="radio3" disabled class="ml-4">
  22. <el-radio label="1" size="small">Option 1</el-radio>
  23. <el-radio label="2" size="small">Option 2</el-radio>
  24. </el-radio-group>
  25. </div>
  26. </template>
  27. <script lang="ts" setup>
  28. import { ref } from 'vue'
  29. const radio1 = ref('1')
  30. const radio2 = ref('1')
  31. const radio3 = ref('1')
  32. </script>