Laravel en Español - Comunidad Hispanoamericana de Laravel

grankan

Miembro

Registrado: 25/01/2014

Mensajes: 14

Laravel + Vue: Enlaces Vue-Router y Enlaces Routes

Buenas

Soy nuevo en esto de Vue y me gustaría saber si pudieran ayudarme. Tengo lo siguiente:

layout.blade.php

<div id="app">
  @include('front.parts.navbar') 
  @yield('content')      
</div>

navbar.blade.php

  <li class="nav-item">
    <router-link to="/features" class="nav-link">Features</router-link>
  </li>
  <li class="nav-item">
    <router-link to="/pricing" class="nav-link">Pricing</router-link>
  </li>
  <li class="nav-item">
    <a class="nav-link" href="{{ url('/login') }}">Log in</a>
  </li>

index.blade.php

@section('content')
	<router-view></router-view>
@endsection

app.js

const Index = Vue.component('Index', require('./components/front/index.vue'));
const Features = Vue.component('Features', require('./components/front/features.vue'));
const Pricing = Vue.component('Pricing', require('./components/front/pricing.vue'));

const routes = [
	{ path: '/', name:'index', component: Index },
    { path: '/features', name:'features', component: Features },
    { path: '/pricing', name:'pricing', component: Pricing }

];

const router = new VueRouter({
    routes, // short for routes: routes
    mode: 'history'
});

window.onload = function () {

	const app= new Vue({
	  	router,
	}).$mount('#app')

}

El problema es que los enlaces de features y pricing funcionan perfectamente, pero cuando hago click en login (mapea una ruta de laravel), luego si vuelvo a hacer click en features o pricing ya no carga los enlaces de Vue :frowning:

Alguien podría echarme una mano por favor,

Mil gracias,