main.vue 915 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. <template>
  2. <a
  3. :class="[
  4. 'el-link',
  5. type ? `el-link--${type}` : '',
  6. disabled && 'is-disabled',
  7. underline && !disabled && 'is-underline'
  8. ]"
  9. :href="disabled ? null : href"
  10. v-bind="$attrs"
  11. @click="handleClick"
  12. >
  13. <i :class="icon" v-if="icon"></i>
  14. <span v-if="$slots.default" class="el-link--inner">
  15. <slot></slot>
  16. </span>
  17. <template v-if="$slots.icon"><slot v-if="$slots.icon" name="icon"></slot></template>
  18. </a>
  19. </template>
  20. <script>
  21. export default {
  22. name: 'ElLink',
  23. props: {
  24. type: {
  25. type: String,
  26. default: 'default'
  27. },
  28. underline: {
  29. type: Boolean,
  30. default: true
  31. },
  32. disabled: Boolean,
  33. href: String,
  34. icon: String
  35. },
  36. methods: {
  37. handleClick(event) {
  38. if (!this.disabled) {
  39. if (!this.href) {
  40. this.$emit('click', event);
  41. }
  42. }
  43. }
  44. }
  45. };
  46. </script>