路由内容未在 Vue-router 和 Laravel 中显示 [英] routes content does not show in Vue-router and Laravel
本文介绍了路由内容未在 Vue-router 和 Laravel 中显示的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我遵循此 YT 教程，但我遵循了这些步骤似乎 ExampleComponent 没有显示.App.vue 显示但不显示路由.
这是我的代码:
app.js
从'vue'导入Vue；从'./router'导入路由器；从'./components/App'导入应用程序；要求('./bootstrap')；const app = new Vue({埃尔:'#app'，组件: {应用程序},路由器，});router.js
从'vue'导入Vue；从'vue-router'导入VueRouter；从'./components/ExampleComponent'导入ExampleComponent；Vue.use(VueRouter);导出默认的新 VueRouter({路线:[{ 路径:'/'，组件:ExampleComponent }],模式:'历史'});App.vue
<模板><h1>你好！</h1><路由器视图></路由器视图></div></模板><脚本>导出默认{名称:应用程序"}</脚本><样式范围></风格>app.blade.php
<div id=app"><应用></应用></div></身体>
web.php
Auth::routes();Route::get('/{any}', 'HomeController@index')->where('any', '.*');
提前致谢.
解决方案 将模式从 history 更改为 hash 因为这种情况下的历史模式保留给 Laravel 路由系统:
export default new VueRouter({路线:[{ 路径:'/'，组件:ExampleComponent }],模式:哈希"});
Im following this YT tutorial, I followed the steps but it seems that the ExampleComponent does not show. The App.vue shows but not the route.
Here are my code:
app.js
import Vue from 'vue';
import router from './router';
import App from './components/App';
require('./bootstrap');
const app = new Vue({
el: '#app',
components: {
App
},
router,
});
router.js
import Vue from 'vue';
import VueRouter from 'vue-router';
import ExampleComponent from './components/ExampleComponent';
Vue.use(VueRouter);
export default new VueRouter({
routes : [
{ path : '/', component : ExampleComponent }
],
mode: 'history'
});
App.vue
<template>
<div>
<h1> Hello!</h1>
<router-view></router-view>
</div>
</template>
<script>
export default {
name : "App"
}
</script>
<style scoped>
</style>
app.blade.php
<body>
<div id="app">
<App></App>
</div>
</body>
web.php
Auth::routes();
Route::get('/{any}', 'HomeController@index')->where('any', '.*');
Thanks in advance.
解决方案 Change the mode from history to hash because the history mode in this case is reserved to Laravel routing system :
export default new VueRouter({
routes : [
{ path : '/', component : ExampleComponent }
],
mode: 'hash'
});
这篇关于路由内容未在 Vue-router 和 Laravel 中显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
