3

我已经成功设置了 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 foundvue-route 被渲染并且user-feed可以通过v-link.

当 vue-router 在home路由之后时，主页会正确呈现但vue-router无法通过v-link，我可以访问 vue-router 的唯一方法是手动输入 url。

我怎样才能和我vue-router的一起使用laravel route？

4

2 回答 2

3

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

于 2016-09-27T01:28:18.753 回答
0

试试这个，这可能会解决你的问题

export var router = new Router({
  hashbang: false,
  history: true,
  linkActiveClass: 'active',
  mode: 'html5'
});
router.map({
  '/': {
    name: 'home',
    component: Home
  },
  '/dashboard': {
    name: 'dashboard',
    component: Dashboard
  },
  '/404notfound': {
    name: 'pagenotfound',
    component: Pagenotfound
  }
});

// For every new route scroll to the top of the page
router.beforeEach(function() {  
  window.scrollTo(0, 0);
});

// If no route is matched redirect home
router.redirect({
  '*': '/404notfound'
});
于 2016-09-27T05:03:10.847 回答