后端的 Laravel VueJS 路由器

Posted 2023-03-14

【中文标题】后端的 Laravel VueJS 路由器

【英文标题】：Laravel VueJS Router in backend

【发布时间】：2020-08-14 15:57:51

【问题描述】：

我正在开发一个所有前端都由 vuejs 管理的 Laravel 项目。

所以，我在以下位置定义了所有后端路由：

routes/api.php

而文件：routes/web.php 它只有这条路线：

Route::view('all', 'app')
    ->where('all', '^((?!api).)*')
    ->name('vue');

将所有责任交给 vue.js。

所以在resources/js（vue 端）里面我定义了前端路由，例如：

    path: '/',
    name: 'home',
    component: home,
    meta: 
        auth: true,
    
,

    path: '/invoices/show/:id',
    name: 'invoices.show',
    component: InvoicesShow,
    meta: 
        auth: true,
    
,

现在的问题：

我开始尝试创建一些通知。

所以在通知上我必须把链接放在客户必须去的地方，但是这个链接是前端的……所以在 Laravel 我不能写 vue.js 路由。那么问题来了，vue.js的命名路由可以写吗？

我想在通知上定义这个链接，例如：

->action('View Invoice', route('invoices.show', $invoiceId));

但命名路由“invoices.show”在 Laravel 路由中不存在。它在 vuejs 路由器上定义，在：resources/js/router/routes.js

所以它不会起作用。

是否可以通过名称获取 vuejs 路由器？

【问题讨论】：

你能解释清楚一点吗？我不明白你到底需要什么......

我改进了问题

【参考方案1】：

其中一个肮脏的解决方法是保留 VueJs 路由，并在您的 routes/web.php 文件中为 Laravel 创建一个新的相同“帮助”路由。

所以你的 web.php 应该是这样的：

Route::view('/invoices/show/id', 'app')->name('invoices.show');
//Here you can add additional "helpers" routes as needed

Route::view('all', 'app')
    ->where('all', '^((?!api).)*')
    ->name('vue');

在这种情况下，VueJs 仍然可以正常工作，您可以在项目中使用 route() 辅助函数，但缺点是如果有任何更改，您需要维护两条路由。

【参考方案2】：

目前，我觉得不可能做到这一点。 所以我只是写了完整的url“硬编码”。

->action('View Invoice', route('vue', ['all' => "invoices/show/$invoiceId"]));

这解决了我的问题，但我无法使用 vue.js 命名的路由。