Vue-Router与laravel路线结合

问题描述

我已经成功设置了vue-router，但是在将其与laravel 5.3路由混合时遇到了一些问题.

我有一个家庭专用的php路由:

Route::get('/', array('as' => 'home', 'uses' => 'HomeController@showWelcome'));

我已经设置了vue-router路由:

'/user-feed': {
    name: 'user-feed',
    title: 'User Feed',
    component: Feed
},

'*': {
    component: PageNotFound
}

在我的web.php路由文件中，我具有以下内容:

Route::get('/', array('as' => 'home', 'uses' => 'HomeController@showWelcome'));

// use vue-router route
Route::get('/{subs}', [function () {
    return view('layouts');
}])->where(['subs' => '.*']);

这里的问题是，当我更改路由的顺序(家用路由器之前的vue-router)并尝试访问home路由时，呈现了Page not found vue-route，而user-feed是可通过v-link使用.

当vue-router在home路由之后时，将正确渲染房屋，但不能通过v-link访问vue-router，而我只能通过手动输入url访问vue-router的唯一方法. /p>

如何与laravel route一起使用vue-router?

解决方案

除非确实有理由，否则您不应该将两者一起用于前端导航. Vue路由器用于单页应用程序，而Laravel的路由系统则用于多页应用程序或API.我认为最常见的设置是让所有Laravel路由，除了说/api/重定向到包含您的SPA的单个模板(例如app.blade.php).从那里，您的vue-router将成为您的前端导航，而您的/api/端点将成为您从laravel进出数据的方式.

I have setup vue-router successfully but I have some problem mixing it with my laravel 5.3 routes.

I have a php route for home:

Route::get('/', array('as' => 'home', 'uses' => 'HomeController@showWelcome'));

and I have setup vue-router routes:

'/user-feed': {
    name: 'user-feed',
    title: 'User Feed',
    component: Feed
},

'*': {
    component: PageNotFound
}

In my web.php route file, I have the following:

Route::get('/', array('as' => 'home', 'uses' => 'HomeController@showWelcome'));

// use vue-router route
Route::get('/{subs}', [function () {
    return view('layouts');
}])->where(['subs' => '.*']);

My problem here is when I change the order of the routes (vue-router before the home router) and I try to access the home route, the Page not found vue-route is rendered and the user-feed is available to be used through v-link.

When vue-router is after the home route, the home is rendered properly but vue-router is not accessible through v-link and the only way I can access the vue-router is by manually entering the url.

How can I use vue-router together with my laravel route?

解决方案

You really shouldn't be using the two together for front end navigation, unless you have a logical reason to. Vue router is intended for single page applications, and Laravel's routing system is intended for multi-page applications, or APIs. The most common set up I think would be to have all Laravel routes except for say /api/ redirect to a single template that includes your SPA, say app.blade.php. From there your vue-router will be your front end navigation and your /api/ endpoints will be how you get data in and out of laravel.

这篇关于Vue-Router与laravel路线结合的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！