link.vue 781 B

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