我如何在 Blade 动态组件中使用 Vue Router

Question

我正在将 Laravel 动态组件（刀片）与 Vue js 一起使用，我想使用 Vue Router 但我不知道如何。

我已经像这样在 index.js 中注册了我的组件：

Vue.component("login", require("./account/login").default);
Vue.component("register", require("./account/register").default);
Vue.component("forgot-password", require("./account/forgot-password").default);
Vue.component("reset-password", require("./account/reset-password").default);

这是我的 home.blade.php

<dynamic-component component="{{ $component }}" id="{{ $id ?? "" }}" />

如何使用 Vue 路由器？在页面之间导航

Answer 1

这样检查https://github.com/cretueusebiu/laravel-vue-spa/tree/master/routes

需要在laravel路由中添加spa.php吗？

然后像这样添加中间件组： App/Http/Kernel.php

/**
     * The application's route middleware groups.
     *
     * @var array
     */
    protected $middlewareGroups = [
        'web' => [
            \App\Http\Middleware\EncryptCookies::class,
            \Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse::class,
            \Illuminate\Session\Middleware\StartSession::class,
            // \Illuminate\Session\Middleware\AuthenticateSession::class,
            \Illuminate\View\Middleware\ShareErrorsFromSession::class,
            \App\Http\Middleware\VerifyCsrfToken::class,
            \Illuminate\Routing\Middleware\SubstituteBindings::class,
        ],

    'spa' => [
        \Illuminate\Routing\Middleware\SubstituteBindings::class,
    ],

    'api' => [
        'throttle:60,1',
        \Illuminate\Routing\Middleware\SubstituteBindings::class,
    ],
];