Im not getting my components rendered by router

Question

Im not getting errors but the page don't show my component and the console dont log any errors, I when I set up the router and get the defaulte template of the router it all works fine, but as soon that I apply my changes, I get nothing.

Here the code

here is the router:

import Vue from 'vue'
import Router from 'vue-router'
import Feed from './views/Feed.vue'
import MyTasks from './views/MyTasks.vue'

Vue.use(Router)

export default new Router({
  mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      name: 'Feed',
      component: Feed
    },
    {
      path: '/my',
      name: 'my',
      component: MyTasks
      
    }
  ]
})

Here is the navBar component that sets the link routes:

<template>
   <nav>
       <v-toolbar flat app>
           <v-toolbar-side-icon class="grey--text" @click="drawer = !drawer"></v-toolbar-side-icon>
           <v-toolbar-title class="text-uppercase grey--text">
               <span class="font-weight-light">
                   Lactogal
                   <span class="font-weight-heavy">RH</span>
               </span>
           </v-toolbar-title>
           <v-spacer></v-spacer>
           <v-btn flat color="grey">
               <span>Log Out</span>
               <v-icon>exit_to_app</v-icon>
           </v-btn>
       </v-toolbar>

       <v-navigation-drawer v-model="drawer" app class="white" >
           <v-list>
               <v-list-tile v-for="link in links" :key="link.text" router :to="link.route">
                   <v-list-tile-action>
                       <v-icon class="white --text">{{ link.icon  }}</v-icon>
                   </v-list-tile-action>
                   <v-list-tile-content>
                       <v-list-tile-title class="white --text">{{ link.text }}</v-list-tile-title>
                   </v-list-tile-content>

               </v-list-tile>
           </v-list>
       </v-navigation-drawer>
   </nav>
</template>

<script>
export default {
    data()
    {
        return {
            drawer: true,
            links:[
                {icon:'dashboard', text: 'Feed', route: '/'},
                {icon:'folder', text: 'Minhas tarefas', route: '/my'},
                
            ]
        }
    }
    
}
</script>

the components:

<template>
    <div class="feed">
        <h1>Feed</h1>
    </div>
</template>

<script>
export default {
    
}
</script>

As I said I get a blank page, the components don't get loaded. The other components are exactly the same code wise.