是否可能某些路由使用vue路由器,而其他路由使用laravel路由器



我所拥有的是一个现有的laravel应用程序,其中包含刀片、laravel路由和一些vue组件。所以我不想用vue路由器取代现有的路由。我想要的是在不干扰现有laravel路线的情况下增加额外的路线。

例如,我有一个类别,它已经在使用以下类别

Route::get('category/index' , 'CategoryController@index')->name('category.index');

然后我想添加一个使用vue路由器的新路由,而不干扰类别路由

例如:

import Dashboard from "../views/Dashboard.vue";
const routes = [
{
path: "/",
name: "Dashboard",
component: Dashboard,
meta: {
requiresAuth: true
}
}
]

这可能吗?

更新:这就是我所做的(如果有人能指出我做错了什么,我将不胜感激(

1.0使用npm 安装Vue路由器

2.0 App.js(使用Vue路由器(

import VueRouter from 'vue-router';
Vue.use(VueRouter);
const routes = [
{ path: '/dashboard', component:  require('./components/Dashboard')},
];
const router = new VueRouter({
routes, // short for `routes: routes` 
mode: 'history',
});

3.0 Web.php

Route::get('/{vue_capture?}', function () {
return view('testing.main');
})->where('vue_capture', '^(?!storage).*$'); 

4.0 main.blade.php(在测试文件夹中(

@extends('layouts.app')
@section('content')
<div class="container" id="app">
<router-view></router-view>
</div>
@endsection

5.0 不起作用

谢谢。

是的,我认为这应该是可能的。

您需要添加一个Laravel路线,该路线可以捕获所有vue路线,并显示包含vue路线的视图。

Route::get('/vue/{vue_capture?}', function () {
return view('vue.index');
})->where('vue_capture', '[/w.-]*');

你应该能够包括这条路线和最初的拉拉威尔路线。一种选择是用/vue作为如上所示的视图路线的前缀,或者,如果您按照正确的顺序放置路线,如果您愿意,您应该能够避免使用前缀。

php artisan route:list命令将帮助您查看当前路由。

是的,你可以而且简单。

你所需要的只是将现有的路由放在vue应用程序处理的路由之上。

它应该是这样的。

web.php

// existing route
Route::get('category/index' , 'CategoryController@index')->name('category.index');
// handle vue app
Route::get('{path}', 'VueController')->where('path', '(.*)');

VueController

public function __invoke()
{
reuturn view('index');
}

对于工作示例,您可以阅读本节以使用vue路由器vue路由器

最新更新