我的laravel-vue代码有什么问题？
我的laravel-vue代码有什么问题？
提问于 2020-06-28 13:17:08
我是vue新手，我在我的laravel项目中安装了vue。但问题是，当我调用一个新的路由时，它不起作用，也不显示想要的结果。这是我的app.js代码：
require('./bootstrap');
window.Vue = require('vue');
import router from "./router";
Vue.component('mainapp',require('./components/mainApp').default);
const app = new Vue({
el: '#app',
router
});这是我的router.js文件代码：
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
import firstPage from './components/pages/myFirstVuePage'
import newRoutePage from './components/pages/newRoutePage'
const routes = [
{
path:'/my-new-vue-router',
component: firstPage
},
{
path:'/new-router',
component: newRoutePage
}
]
export default new Router({
mode:'history',
routes
})这是我的vue文件代码：
<template>
<div>
<h1>this is my first vue page</h1>
</div>
</template>
<script>
export default {
name: "myFirstVuePage.vue"
}
</script>这是mainApp.vue文件代码：
<template>
<div>
<h1>this is the first component</h1>
<router-view></router-view>
</div>
</template>
<script>
export default {
name: "mainApp.vue"
}
</script>
<style scoped>
</style>这是我的welcome.blade.php代码：
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laravel</title>
</head>
<body>
<h1>this the body</h1>
<div id="app">
<mainapp></mainapp>
</div>
</body>
<script src="{{asset('js/app.js')}}"></script>
</html>输出结果如下所示：
“这是正文这是第一个组件”
回答 1
Stack Overflow用户
发布于 2020-06-28 14:26:38
删除。vue扩展组件名称属性值名称："myFirstVuePage“也在main.vue文件名中："mainApp”
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62618520
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号