PageSidebarAside.vue

<template>
  <aside>
    <h1 class="text-xl uppercase text-gray-400 font-bold mb-2">
      {{ title }}
    </h1>

    <nuxt-link
      v-for="(item, index) of items"
      :key="index"
      v-prevent-last-char-break
      :to="item.path"
      class="block leading-5 mb-2 text-gray-500 hover:text-hover"
    >
      {{ item.title }}
    </nuxt-link>
  </aside>
</template>

<script>
import { defineComponent } from '@vue/composition-api'

export default defineComponent({
  props: {
    title: {
      type: String,
      default: null,
    },
    items: {
      type: Array,
      required: true,
    },
  },
})
</script>