Vue-router 不在頁面上顯示組件

Question

我的路由器有問題。 我想在我的索引頁面上顯示bodyComponent ，但什么也沒發生。 我使用 laravel+vue。 我在哪里可以犯錯？ 我沒有錯
我的路由器：

import Vue from 'vue'
import VueRouter from 'vue-router'
import bodyComponent from '../views/bodyComponent'

Vue.use(VueRouter)

const router= new VueRouter({
    mode: "history",
    routes:[
        {
            path:"/",
            components: {
                default: bodyComponent,
            }
        }
    ]
})
export default router;

應用程序.js

import router from "./router"
const app = new Vue({
    el: '#app',
    router
});

我的 index.blade.php

<div id="app">
        <header-component></header-component> 
        <!--<body-component></body-component>-->
        <router-view></router-view>
        <footer-component></footer-component>
</div>

Answer 1

我更改了我的 vue 路由中的路徑，並且組件顯示在索引頁面上。 在應用程序索引頁面上，我來自 laravel 路由器。 所以我將路徑更改為 vue 路由器中索引頁面的路徑，名稱與 laravel 路由相同
我的 laravel 路由器

Route::get('/tobyten', function () {
        return view('tobyten.index');
    })->name('tobyten');

我的vue路由器

const router= new VueRouter({
    mode: "history",
    routes:[
        {
            path:"/tobyten",
            components: {
                default: bodyComponent,
            }
        }
    ]
})