【vue3】[Vue Router warn]: No match found for location with path “/“ 之类的问题记录(低级错误)

今天初次上手vue3配置路由的时候明明跟着实例编写的代码,访问页面时总是渲染出来,结果闹了个乌龙,访问路径写错了

🌼正确访问方式应当是: 域名+端口+路径:http://127.0.0.1:5173/index,注意端口后面需要加上路由对应的路径,若没有则访问 路径为 ‘/’ 的页面。

  • 页面代码:src/views/index.vue
<template>
  <div>首页</div>
</template>

<script setup>
</script>

<style lang="scss">
</style>
  • 路由器:src/router/index.js
import {createRouter,createWebHistory} from 'vue-router'

const routes = [
    {
        name: '首页'
        ,path: '/index'
        ,component: () => import('../views/index.vue')
    }
];
const router = createRouter({
    routes
    ,history:createWebHistory()
});
export default router

出错在这里,访问地址应该后加上 /index

  • 应用入口代码:src/App.vue
<template>
  <div>
    <router-view />
  </div>
</template>

<script setup>
</script>
<style scoped>
</style>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值