如何在Laravel内部使用Vue路由器？
如何在Laravel内部使用Vue路由器？
提问于 2022-10-30 06:34:34
我是用laravel9和vue3开发的。
我的问题很简单，但是路径设置不太好。
当我访问url localhost:8080/tasks时
此url返回404，未找到，我得到以下类型的错误
获取http://localhost:8000/tasks 404 (未找到)
我不知道原因，但是当我将path：/tasks重写为path /，localhost:8080返回我想要的组件时。
我有以下文件。
router.js
import { createRouter, createWebHistory } from "vue-router";
import TaskListComponent from "./components/TaskListComponent.vue";
const router = createRouter({
history: createWebHistory(),
routes: [
{
path: '/tasks',
name: 'tasks.list',
component: TaskListComponent
}
]
})
export default routerApp.vue
<script setup>
import HeaderComponent from "./components/HeaderComponent.vue";
</script>
<template>
<HeaderComponent />
<router-view></router-view>
</template>bootstrap.js
import { createApp } from "vue";
import App from "./App.vue";
import router from "./router.js"
const app = createApp(App);
app.use(router);
app.mount("#app");回答 2
Stack Overflow用户
回答已采纳
发布于 2022-11-02 05:42:25
web.php中的以下内容解决了这个问题
Route::get('{any?}', function () {
return view('welcome');
})->where('any', '.*');Stack Overflow用户
发布于 2022-10-30 10:50:48
我使用Vue's CLI创建了一个项目，然后继续检查所有相关部分。
我接受了您的代码并应用了各种更改：
- 我的入口点是
main.js，而不是bootstrap.js，但是没有代码上的更改。 - 在
App.vue中，我没有任何HeaderComponent，但它不应该成为一个问题 - 在
router/index.js中，我只更改了组件的以下内容，因为与其使用相对路径，不如使用别名
import TaskListComponent from "@/components/TaskListComponent.vue"启动服务器
pnpm dev给我一些端口，一旦跟随到/tasks路径，我就可以看到预期的组件。
路线也有适当的定义。
这是我的项目目录
控制台里没有任何错误。
以下是公共github：https://github.com/kissu/so-v3-working-router
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/74251016
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号