link.vue 827 B

1234567891011121314151617181920212223242526272829303132333435
  1. <template>
  2. <p>Basic link button</p>
  3. <div class="flex justify-space-between mb-4 flex-wrap gap-4">
  4. <el-button
  5. v-for="button in buttons"
  6. :key="button.text"
  7. :type="button.type"
  8. link
  9. >{{ button.text }}</el-button
  10. >
  11. </div>
  12. <p>Disabled link button</p>
  13. <div class="flex justify-space-between flex-wrap gap-4">
  14. <el-button
  15. v-for="button in buttons"
  16. :key="button.text"
  17. :type="button.type"
  18. link
  19. disabled
  20. >{{ button.text }}</el-button
  21. >
  22. </div>
  23. </template>
  24. <script setup lang="ts">
  25. const buttons = [
  26. { type: '', text: 'plain' },
  27. { type: 'primary', text: 'primary' },
  28. { type: 'success', text: 'success' },
  29. { type: 'info', text: 'info' },
  30. { type: 'warning', text: 'warning' },
  31. { type: 'danger', text: 'danger' },
  32. ] as const
  33. </script>