时间戳

首页 > 解决方案 > Vue 路由器未在 Laravel 应用程序中加载页面

laravel - Vue 路由器未在 Laravel 应用程序中加载页面

问题描述

我正在尝试加载 vue 路由器页面。不知道出了什么问题。这是我所做的。

在router.js文件中我有

import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
import testPage from './test.vue';
 
const defaultRoutes = [
    {path: '/test', component: testPage}
 ]
 
 export default new Router({
    mode: 'history',
    defaultRoutes
  })

在app.js文件中我有

require('./bootstrap');
window.Vue = require('vue');
Vue.component('mainapp', require('./mainapp.vue').default);
import router from './router'
const app = new Vue({
    el: '#app',
    router
});

在mainapp.vue文件中我有

<template>
<div>
    <h1>this is the main app !</h1>
     <router-view></router-view>
</div>
</template>

在test.vue我有

<template>
<div>
    <h1>this is the test page</h1>
</div>
</template>

当我点击/testurl 但testPage组件未加载时，我可以看到加载的 h1 文本。

任何人都可以帮忙吗？谢谢。

标签： laravelvue.jsvuejs2vue-componentvue-router

解决方案

将名称更改defaultRoutes为routes。

推荐阅读