Data в Vue.component?
1. Достаточно 1 раз создать экземляр в коде на статре приложения.
2. Компонент может содержать все возможные свойства и метода Vue в том числе и data.
3. Документация по компонентам максимально исчерпывающая: Основы компонентов
Решил<div id="navbar">
  <block-navigation></block-navigation>
  <span>World!</span>
  <other-components></other-components>
</div>Vue.component('block-navigation', {
    props: ['val'],
    data() {
      return {
        navlist: [
          { link: 'name-1', name: 'linkName-1' },
          { link: 'name-2', name: 'linkName-2' },
          { link: 'name-3', name: 'linkName-3' },
          { link: 'name-4', name: 'linkName-4' },
          { link: 'name-5', name: 'linkName-5' },
        ]
      }
    },
    template: `
    <ul>
    	<li 
      	v-for="val in navlist"
        :key="val.id">
        <a :href=val.link :title=val.name>{{ val.name }}</a>
      </li>
    </ul>
    `
  })

  new Vue({
    el: '#navbar'
  })