■ コンポーネントデモ(demo)

≡

■ 概要（Overview）

コンポーネント名

NavListItem

レベル (Atomic Design)

原子（Atom）

カテゴリー（category）

navigations

■ データ（Data）

【props】

to (String | Object): ナビゲーションリンクのURL。デフォルトは / です。
icon (String, required): ナビゲーションリンクのアイコン。デフォルトは mdi-home です。
linkName (String, required): ナビゲーションリンクの名前。デフォルトは home です。

■ 使用例（Usage Example）

<script setup>
import { ref } from 'vue'
import { NavBar } from 'revuekitz'

import { mdiInformationOutline } from '@mdi/js'

const navBarVisible = ref(false)
const showNavBar = () => {
  navBarVisible.value = true
}
const closeNavBar = () => {
  navBarVisible.value = false
}
</script>

<template>
  <div class="three-lines mr-2" @click="showNavBar">&equiv;</div>
  <NavBar :isVisible="navBarVisible" @close="closeNavBar">
    <NavBarItem to="" :icon="mdiInformationOutline" linkName="TEST" />
  </NavBar>
</template>