Link 链接 ​

<template>
  <div>
    <tu-link>默认链接</tu-link>
    <tu-link type="primary">主要链接</tu-link>
    <tu-link type="success">成功链接</tu-link>
    <tu-link type="warning">警告链接</tu-link>
    <tu-link type="danger">危险链接</tu-link>
    <tu-link type="info">信息链接</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}

</style>

<template>
  <div>
    <tu-link>默认链接</tu-link>
    <tu-link type="primary">主要链接</tu-link>
    <tu-link type="success">成功链接</tu-link>
    <tu-link type="warning">警告链接</tu-link>
    <tu-link type="danger">危险链接</tu-link>
    <tu-link type="info">信息链接</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}

</style>

<template>
  <div>
    <tu-link disabled>默认链接</tu-link>
    <tu-link type="primary" disabled>主要链接</tu-link>
    <tu-link type="success" disabled>成功链接</tu-link>
    <tu-link type="warning" disabled>警告链接</tu-link>
    <tu-link type="danger" disabled>危险链接</tu-link>
    <tu-link type="info" disabled>信息链接</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>

<template>
  <div>
    <tu-link disabled>默认链接</tu-link>
    <tu-link type="primary" disabled>主要链接</tu-link>
    <tu-link type="success" disabled>成功链接</tu-link>
    <tu-link type="warning" disabled>警告链接</tu-link>
    <tu-link type="danger" disabled>危险链接</tu-link>
    <tu-link type="info" disabled>信息链接</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>

<template>
  <div>
    <tu-link :underline="false">无下划线</tu-link>
    <tu-link>带下划线</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>

<template>
  <div>
    <tu-link :underline="false">无下划线</tu-link>
    <tu-link>带下划线</tu-link>
  </div>
</template>
<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>

<template>
  <tu-link :icon="Edit">编辑</tu-link>

  <tu-link>
    加载中<tu-icon><Loading /></tu-icon>
  </tu-link>
</template>

<script lang="ts" setup>
import { Edit, Loading } from '@tu-view-plus/icons-vue';
</script>

<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>

<template>
  <tu-link :icon="Edit">编辑</tu-link>

  <tu-link>
    加载中<tu-icon><Loading /></tu-icon>
  </tu-link>
</template>

<script lang="ts" setup>
import { Edit, Loading } from '@tu-view-plus/icons-vue';
</script>

<style scoped>
.tu-link {
  margin-right: 8px;
}
</style>