每日一错——vue3简单配置路由

最新推荐文章于 2024-05-09 22:55:08 发布
最新推荐文章于 2024-05-09 22:55:08 发布
阅读量582 收藏 4
点赞数 5
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_55080820/article/details/130276978
版权

先看报错：vue-router.mjs:1486  Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')
    at createRouterMatcher (vue-router.mjs:1486:12)
    at createRouter (vue-router.mjs:2942:21)
    at index.js?t=1681999549262:12:14

 大概是找不到，没有定义forEach

网上看可能是view-router版本问题等，我用的是vue3,view-router用的是4以上。没有问题，最后看到Vue-Router4.0 报“Cannot read property ‘forEach‘ of undefined” - 简书 (jianshu.com)icon-default.png?t=N3I4https://www.jianshu.com/p/36e48c72f848发现自己是这里错了

改正后就可以成功访问

 

 

 

应用锁正在保护
关注
  • 5
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 5
    评论
Chrome如何安装react-developer-tools插件及解决安装后报出的错误：Uncaught TypeError: Cannot read properties of undefined
念兮为美
07-06 2396
Chrome如何安装react-developer-tools插件及解决安装后报出的错误：Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')——./node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:17:1)...............
VueJs路由跳转——vue-router的使用详解
10-20
【VueJs路由跳转——vue-router的使用详解】 Vue.js是一个流行的前端JavaScript框架，用于构建用户界面，尤其适合单页应用程序。为了管理页面间的跳转和状态，Vue.js引入了vue-router作为官方的路由库。vue-router...
vue3报错SyntaxError: Unexpected identifier和Cannot destructure property `default` of ‘undefined‘ or ‘nu
qq_39528534的博客
12-28 3674
昨天报了这个错误，当时还同时报了其它错误，Cannot destructure property `default` of 'undefined' or 'null'。我的代码是用v-on绑定了一个click函数，在method中编写这个函数就报错，也不知道怎么的我就盯着这个错误Cannot destructure property `default` of 'undefined' or 'null'鼓捣了一个小时，越看越觉得不可思议，我一度以为我的函数逻辑出错了，我检查了我的代码，没任何问题，然后我将在m
浏览器报错：Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach‘)
Ai_Answer_zr的博客
01-04 1450
2024-1-4浏览器报错：Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')
21-Vue项目报错：Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach‘)
最新发布
q506174602的博客
05-09 358
21-Vue项目报错：Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach‘)
vue3使用路由报TypeError: Cannot read properties of undefined (reading “forEach“)
Ccyu86的博客
12-17 1057
问题就出现在上图所示,好像是这样的写法vue3无法读取到router的内容 ,然后在main.js中导入使用 , 这些步骤都是没错。根据视频教程写成这样。
Vue路由报错：TypeError: Cannot read properties of undefined (reading ‘_self‘)undefined (reading ‘$route‘)
weixin_43913958的博客
06-16 2049
TypeError: Cannot read properties of undefined (reading '_self')undefined (reading '$route')
vue3+webpack+vue-router封装路由
05-21
vue3+webpack+vue-router封装路由，资源内容包含了vue3+webpack+vue-router，并且代码对vue-router路由进行了封装，资源下载下来之后项目代码需要先：npm install，之后就可以运行启动项目了，代码结构清晰，没有...
vue3+webpack+vue-router路由+axios
05-21
vue3+webpack+vue-router路由+axios，资源包含了vue3+webpack+vue-router路由+axios的相关代码，并且对vue-router路由进行了封装，也对axios进行了封装，资源代码需要先：npm install 安装下依赖组件之后就可以启动...
解决vue多个路由共用一个页面的问题
08-27
解决 Vue 多个路由共用一个页面的问题 在 Vue 开发中，遇到多个路由需要共用一个页面的需求是非常普遍的，特别是当路由是通过动态添加的，不同的路由展示的东西只是数据不同其他没有变化。这篇文章将与您分享解决 ...
解决报错“TypeError: Cannot read properties of undefined (reading ‘xxx‘)“
qq_63524016的博客
01-14 1万+
异步请求获取数据时，由于数据时异步获取的，所以一开始是没有该数据属性，这种情况下也会报这种错误。出现该错误的原因是因为你花括号中的某些属性未定义。很有可能是因为你写错了属性名称。我报错的原因是在计算属性里面，数组多打了一个字母。
解决异步传参时出现 “TypeError: Cannot read properties of undefined (reading‘xxx‘)“这一错误
AiHongHong_的博客
02-16 1万+
解决异步传参时出现 “TypeError: Cannot read properties of undefined (reading‘xxx‘)“这一错误
Vue-Rooter传参问题记录Cannot read properties of undefined
qq_41643226的博客
07-31 313
vue router传参
解决 Cannot read properties of undefined类型的报错
热门推荐
weixin_43706224的博客
03-13 2万+
报错类型一般为两种对象类型对象没有数据的时候为undefined 这个时候访问内部内容就会报错举个例子正常情况 对象有值的时候var obj={name:‘张三’,age:18}#此时对象有数据访问不会报错123对象没值的时候var obj={}#就会报错 Uncaught SyntaxError: Unexpected token ‘.’#表示空对象{}不能使用.1234对象为undefined的时候。
解决Vue3报错：app.js:314 Uncaught TypeError: Cannot read properties of undefined (reading ‘forEach‘)
m0_61973028的博客
11-03 1102
app.js:314 Uncaught TypeError: Cannot read properties of undefined (reading 'forEach')解决方案，可能是配置的。
解决 “TypeError Cannot read properties of undefined (reading ‘xxx‘)“
m0_67393413的博客
03-10 9346
//这个报错 我的问题是 要用到的数据读不到这个属性（我用的vue） //1.检查你的data定义的属性是不是没有你用到的这个属性,没有的话就定义一个，如下： #template <div class="he-info__item"> <span class="he-label">收货人姓名:</span> <span class="he-value">{{ detail.buyer.name }}</span> </div&
vue报错：Cannot read properties of undefined (reading ‘0‘)
SendChen的博客
05-25 809
vue报错：Cannot read properties of undefined (reading '0')解决办法
Vue-Router源码解析：createMatcher
hd101367816的博客
03-05 1080
createMatcher 在上一章VueRouter构造器中会调用createMatcher创建一个matcher对象，我们这次来看看createMatcher具体做了些什么。 //添加静态路由 const { pathList, pathMap, nameMap } = createRouteMap(routes) 先使用了createRouteMap创建了了三个对象pathList，pathMap，nameMap。 进入createRouteMap查看。 createRouteMap exp
vue Uncaught TypeError: Cannot read properties of undefined (reading ‘prototype‘) 报错
qq_45281478的博客
08-29 1万+
Uncaught TypeError: Cannot read properties of undefined (reading 'prototype')
vue3怎么配置路由
02-28
在Vue 3中配置路由需要使用Vue Router库。下面是配置Vue 3路由的步骤： 1. 首先，确保你的项目已经安装了Vue Router。可以使用以下命令进行安装： ``` npm install vue-router@next ``` 2. 在你的Vue项目的入口文件（通常是main.js）中，导入Vue Router并使用它： ```javascript import { createApp } from 'vue' import { createRouter, createWebHistory } from 'vue-router' import App from './App.vue' const router = createRouter({ history: createWebHistory(), routes: [ // 在这里定义你的路由 ] }) const app = createApp(App) app.use(router) app.mount('#app') ``` 3. 在`routes`数组中定义你的路由。每个路由都是一个对象，包含`path`和`component`属性。`path`指定URL路径，`component`指定对应的组件。例如： ```javascript const routes = [ { path: '/', component: Home }, { path: '/about', component: About }, // 其他路由... ] ``` 4. 在你的Vue组件中使用路由。可以使用`<router-link>`组件创建链接，使用`<router-view>`组件显示对应的组件。例如，在App.vue中： ```html <template> <div> <router-link to="/">Home</router-link> <router-link to="/about">About</router-link> <router-view></router-view> </div> </template> ``` 这样就完成了Vue 3的路由配置。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

应用锁正在保护

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值