Link

Description

The component provides a hypertext link.

Connection

<template>
  <Link path="String(required)">Hypertext link</Link>
</template>

API

Props

Name	Type	Description	Default
path	String(required)	Link url	-
target	String	Target attr	'_blank'

Slots

Name	Description
default	Link text

Render

Hypertext link

Source code

@/src/components/Link/Link.vue

<template>
  <a :href="path" :target="target" class="link">
    <slot />
  </a>
</template>

<script>
export default {
  name: 'Link',

  props: {
    path: {
      type: String,
      required: true,
    },
    target: {
      type: String,
      required: false,
      default: '_blank',
    },
  },
};
</script>

<style lang="stylus" scoped>
@import "~/src/stylus/_stylebase.styl";

.link
  cursor pointer
  display inline
  text-decoration none !important
  color $colors.primary

.link:hover
  text-decoration none !important
  border-bottom 2px solid $colors.primary
</style>