Link Vue コンポーネント

Linkは、ナビゲーション、カスタムアクション、タブの切り替え、モーダルの開閉などのためのリンクを作成する主要なコンポーネントです。

リンクコンポーネント

以下のコンポーネントが含まれています。

名前	型	デフォルト	説明
colors	object		Tailwind CSSの色のクラスを持つオブジェクト
colors.navbarTextIos	string	'text-primary'
colors.navbarTextMaterial	string	''
colors.textIos	string	'text-primary'
colors.textMaterial	string	'text-md-light-primary dark:text-md-dark-primary'
component	string	'a'	コンポーネントのHTML要素
iconOnly	boolean	false	リンクにアイコン以外何も含まない場合に有効にします
linkProps	any		Link/Buttonに渡す追加のプロパティ（属性）を持つオブジェクト
navbar	boolean	false	Linkがナビゲーションバーにある場合に有効にする必要があります
tabbar	boolean	false	Linkがタブバーにある場合に有効にする必要があります
tabbarActive	boolean	false	タブバーのリンクを現在アクティブとして強調表示します
toolbar	boolean	false	Linkがツールバーにある場合に有効にする必要があります
touchRipple	boolean	undefined	マテリアルテーマでタッチリップル効果を有効にします。指定しない場合、リンクが`toolbar`、`tabbar`、または`navbar`の場合、デフォルトで有効になります。

名前	型	説明
click	function(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>