連結 Vue 組件

連結是建立導航連結、自訂動作、切換標籤、開啟/關閉模態框等的主要組件。

連結組件

包含以下組件

名稱	類型	預設值	描述
colors	物件		帶有 Tailwind CSS 色彩類別的物件
colors.navbarTextIos	字串	'text-primary'
colors.navbarTextMaterial	字串	''
colors.textIos	字串	'text-primary'
colors.textMaterial	字串	'text-md-light-primary dark:text-md-dark-primary'
component	字串	'a'	組件的 HTML 元素
iconOnly	布林值	false	如果連結除了圖示外不包含任何內容，則啟用此項
linkProps	任何		帶有要傳遞給連結/按鈕的其他屬性（attributes）的物件
navbar	布林值	false	如果連結在導覽列中，則應啟用
tabbar	布林值	false	如果連結在標籤列中，則應啟用
tabbarActive	布林值	false	將標籤列連結標示為目前啟用
toolbar	布林值	false	如果連結在工具列中，則應啟用
touchRipple	布林值	未定義	在 Material 主題中啟用觸控漣漪效果。如果未指定，如果連結為 `toolbar`、`tabbar` 或 `navbar`，則預設啟用

名稱	類型	描述
click	函數(e)	點擊處理器

<k-link href="/about">About</k-link>

<k-link href="https://google.com" target="_blank"> Google </k-link>

<k-link :link-props="{to: '/about'}" component="router-link">
  About
</k-link>

<k-navbar title="My App">
  <template #right>
    <k-link navbar @click="openMenu">Menu</k-link>
  </template>
</k-navbar>

<k-toolbar>
  <k-link toolbar @click="action1">Action 1</k-link>
  <k-link toolbar @click="action2">Action 2</k-link>
</k-toolbar>