1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > vue3报错“ Uncaught TypeError Cannot read property ‘use‘ of undefined”

vue3报错“ Uncaught TypeError Cannot read property ‘use‘ of undefined”

时间:2018-10-04 21:31:47

相关推荐

vue3报错“ Uncaught TypeError Cannot read property ‘use‘ of undefined”

在跟着视频学习用vue配置路由时,在路由文件中使用Vue.use(router)的语句无法正常启动服务,并且浏览器报错,提示‘use’并未定义;看了一下,如下图,vue中没有use()这个方法

经过查找资料后发现,这种加载vue-router的方式是vue2使用的,但我现在用的是vue3(跟着视频创建项目时老师说vue3更新的东西也不会对我们的项目产生什么影响之类的,喜新厌旧的我就直接用了vue3,导致和课程配置不一样了)。因此,我现在需要使用vue3的方式来导入vue-router。

首先,在路由文件里,我们已经不再需要通过下面这三句程序来导入vue-router了,下面这三句话要删掉:

import Router from 'vue-router'import Vue from 'vue'Vue.use(Router)

然后如下图,加上红框内的代码:

import {createRouter, createWebHistory} from 'vue-router'const routerHistory = createWebHistory()const router = createRouter({history: routerHistory,/** 在这里和vue2一样写路由配置*/}

再然后,需要在main.js里作路由导入:

import {createApp} from 'vue'import router from './router'import App from './App.vue'const app = createApp(App)app.use(router)app.mount('#app')

ok,到了这一步其实vue3关于vue-router的导入已经完成了,可是运行项目时仍然会报错,提示下图中的createWebHistory不是一个function;查看了vue-router源文件后发现并没有我们所需要导入的两个方法。

这个时候的话可以考虑一下是不是vue-router的版本不对,查看package.json文件后发现,我所安装的vue-router版本是3.5.1;但根据我找到的资料来看,需要4.0以上的版本才能适配,所以通过下面的命令安装了v4的vue-router

npm install vue-router@4

最后,我的项目就成功运行起来了,撒花;接着,来一波参考链接,感谢!

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。