Cómo utilizar datos de la instancia Vue en los templates de las rutas de Vue Router.
Este es mi código
HTML
<div id="app">
<router-link to="/foo/1">ruta 1</router-link>
<router-link to="/foo/2">ruta 2</router-link>
<router-view></router-view>
</div>
Javascript
Vue.use(VueRouter);
const Ruta1 = { template: '<div>{{ $route.params.numruta }}</div>' };
const Ruta2 = { template: '<div>{{ $route.params.id }}</div>' };
const router = new VueRouter({
routes: [
{ path: '/foo/:numruta', component: Ruta1 },
{ path: '/foo/:numruta', component: Ruta2 }
]
});
const app = new Vue({
router,
el: "#app",
data:{
usuario:"nombre de usuario"
}
}).$mount('#app');
En ese caso utilizar el elemento usuario
en el templpate
de Ruta1