vue配置路由，页面内容不展示

最新推荐文章于 2024-07-22 10:34:36 发布
最新推荐文章于 2024-07-22 10:34:36 发布
阅读量4.1k 收藏 4
点赞数 3
分类专栏： 项目中遇到的错误 文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_52318340/article/details/125792231
版权
本文记录了一个关于Vue应用中路由配置的常见问题，即忘记添加<router-view>导致页面内容无法显示，以及版本不匹配引发的错误。作者指出，即使配置正确，若Vue、vue-router和vuex版本不一致，也可能出现路由内容不显示的状况。解决此问题需要确保package.json中相关插件版本对应。
摘要由CSDN通过智能技术生成

这问题的解决方式有很多种，我这里只记录一下最让我们忽略的两点：

1.引用组件跳转时别忘了<router-view ></router-view> 这个一定要有，他是跳转的地方展示内容的，如果没有就不不知道跳转的页面内容放在那了
2.如果以上配置都没有问题，那么需要查看一下package.json文件，查看router相关插件本版好是否对应。

小编就是版本号不对应，vue本版2，vue-router 版本4 ，vuex本版4，导致页面配置的路由内容不显示。
就这么一个问题搞了一天左右，想想就很蛋疼，哎

菜菜艾
关注
  • 3
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue router路由嵌套不显示问题的解决方法
08-30
主要为大家详细介绍了vue router路由嵌套不显示的问题，具有一定的参考价值，感兴趣的小伙伴们可以参考一下vue-router 路由嵌套不显示问题
vue2 vue-router 不显示页面问题
LlanyW的专栏
10-30 1万+
最后发现是vue-router版本的问题,最新的版本是4.x.x ， 使用cnpm install vue-router -S， 时默认安装了最新。我的项目的问题是，版本不兼容，环境配置不对。在项目配置的时候，默认 npm 包导出的是运行时构建，即 runtime 版本，不支持编译 template 模板。vue 在初始化项目配置的时候，有两个运行环境配置的版本：Compiler 版本、Runtime 版本。首先去看了是否是vue-router引用的问题,排除掉引用问题之后,网上冲浪找了不少方法,
vue问题：已经配置router，但是无法访问页面
最新发布
唯有热爱 可抵万难
07-22 186
配置后，页面无法正常访问，访问后为空白，但是如果在APP.vue里面添加内容时是可以正常显示的。
vue路由不显示路由页面
dangzefei的博客
05-29 829
千万不能同时导入两个路由！！！如下： // import router from './router' //1.导入路由 import VueRouter from 'vue-router' 下面是使用vue中路由的步骤： // The Vue build version to load with the `import` command // (runtime-only or standalone) has been set in webpack.base.conf with an alia.
vue页面不显示
weixin_48927323的博客
05-25 5085
-某个页面东西忘记了没写完......--哪里挂载vue上的什么东西干扰到。--检查路由配置，书写书否规范正确。页面死活不显示以及不报任何错误。--查找是否有中文路径。2.不要使用中文路径。
vue-router中子路由内容不显示
jolinoy的博客
03-07 3384
项目目录： 首先看下，我在User.vue下面挂载两个子组件：Posts.vue和Profile.vue。 两个子组件的代下如下： Posts.vue代码： // Posts.vue里面的内容 <template> <div> <h2>Posts页面</h2> </div> </template> <script> export default {
vue页面不显示效果
weixin_44501320的博客
09-10 5433
最近在写vue，所以有点小坑给列出来 1、vue绑定页面但是不显示样式 vue绑定的div里面设置字体时不要用<text>标签，否则绑定的div里面的样式全部显示不出来     暂时就这样，如果还有坑我之后在更新加粗样式 ...
vue3中使用路由功能，页面路由内容不能正常显示，并且路由标签不能点击
weixin_51174757的博客
09-07 1997
插件的执行应该在mount钩子之前，将代码的顺序调整一下，页面就可以正常显示，并且控制台也不再有warn报错。上网查询了很多帖子，并没有能解决这个问题，突然想到是不是main.js文件中代码的执行顺序有问题。最近在用vue写项目，在配置路由时碰到了一个问题。
Vue中配置路由完成后，页面组件点击但无法显示
qq_53176558的博客
08-10 183
找了几分钟才找到，初学者还是得认真，尤其是对单词的拼写。
vue项目加上路由组件页面不显示
weixin_61286286的博客
05-01 4292
注意：切记已经要export default router导出，不然在下面main.js中配置是import导入会找不到index.js这个文件。查看项目文件中package.json(或package-lock.json)中vue-router依赖是否成功添加。这个问题的主要还是路由没有配置好，导致App.vue文件无法显示，下面是。配置路由表index.js。
VueRouter-在嵌套路由的过程中子路由不显示的问题
weixin_44161147的博客
07-18 5486
VueRouter-在嵌套路由的过程中子路由不显示的问题 代码场景 预期的是下面的展示： 新闻和消息为嵌套的路由，当点击新闻的时候，会展示新闻列表，当点击消息的时候，会出现消息列表 错误场景 但是当我运行的时候，点击新闻按钮，不显示新闻子路由的内容，点击消息按钮，也不显示消息子路由的内容，代码也没有报错 解决方案 1.父组件中没有写“router-view"标签，在父组件中补上即可： 2.在配置子路由router的过程中子路由的path没有加"/" { path: '/h
Vue路由明明配置好了页面还是不显示
qq_45535340的博客
11-18 6538
在开发vue项目时，使用vue-router 路由老失效 问题代码 Vue.use(VueRouter) var routeslist=[ { path:'/', redirect:'/home' }, //配置路由，这里是个数组 { //每一个链接都是一个对象 path: '/home', //链接路径 name: 'home', //路由名称， component: index
vue 路由能够跳转，但不显示内容
z_sr1的博客
09-30 498
<router-linkto="/">首页</router-link>| <router-linkto="About">About</router-link> 已经成功跳转 不显示每个页面的内容 需要加上 <router-view></router-view>
router路由跳转但页面内容不显示
weixin_41618672的博客
02-02 450
新手入门vue3踩坑记录
vue运行后没有显示内容
m0_54256047的博客
10-22 1205
运行成功没有报错但是就是不显示内容 进浏览器看到控制台的报错信息：vue.runtime.esm.js?c320:4573 [Vue warn]: Property or method "yzmStr" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based comp
记录vue-router使用嵌套路由，子路由页面不显示问题
danny_799745061的博客
09-09 3207
记录vue-router使用嵌套路由，子路由页面不显示问题
vue-router 嵌套子路由无效，不显示页面问题
潜心
10-08 5809
在中大型vue项目中，嵌套路由是避不开的话题。
vue多层嵌套子路由不显示
weixin_44032244的博客
09-20 1149
组件Weekends的路由为“/schedule/weekends”，要在父组件中渲染需要配置router-link（访问链接，相当于html中的。
vue路由匹配上之后，但页面空白的问题
热门推荐
前端-卡布达的博客
01-30 1万+
在vue项目中，可能会遇到路由匹配上之后，页面空白没有内容的情况，就像下面截图所示： 于是就查看了一些其他朋友对该问题的回答，主要有下面几点： 1、路由配置重复，如果配置了两个重复的路由，比如配置了两个【path: '/'】，那么访问就会看到空白页面，这时候改下重复的路由配置即可。 2、访问的页面没有配置路由，那么访问的页面也可能是空白页，比如访问/test，但是路由里却没有配置，也不会出现页面。 但是我排查了上面这两点，发现都不存在上面两点的问题，但是页面还是不出来。后来仔细排查发现问题.
解决Vue路由切换页面不更新问题的三种方法
本文主要探讨了Vue路由切换页面不更新的问题及其解决方案。在Vue应用中，由于路由切换实际上是组件的动态加载而不是实际的页面刷新，可能会导致某些情况下组件未能正确更新。针对这个问题，本文提供了两种解决方案：...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值