vue的首页渲染了两次的原因以及解决方法

最新推荐文章于 2023-09-19 14:29:07 发布
最新推荐文章于 2023-09-19 14:29:07 发布
阅读量2.1k 收藏 1
点赞数
分类专栏： 前端
原文链接：https://www.mk2048.com/blog/blog_hjkibc0hbbab.html
版权

现在在用vue做一些单页面应用的东西，遇到了些许问题啊，比如我再渲染首页的时候，会渲染两次，查看了一下原因，原来是在写路由的时候写的格式错了：

 1083235-20180726155516089-1871202868.png

这样的时候，初始的时候就是加载的exam_list页面，但是会加载两次，

解决方法，把首页的url单独拿出来写进路由，初始的时候进行路由重定向即可：

1083235-20180726155653120-2139247740.png

 

xiaozhen0610
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue 3 antv 重新渲染解决方案
观炎记事
11-26 1865
为了解决这个侧边栏伸缩效果触发后页面图表重新渲染铺满显示块的问题，在百度搜了好久都没有相关解决方案，为此独自研究了一下，没想到这么简单，以下是相关解决方案： // Vue 3 // store.ts export default createStore({ state: { collapse: false }, getters: { getCollapse: (state) => state.collapse }, mutations: { setCollapse (state
vue 解决数组赋值无法渲染在页面的问题
10-16
总结来说，解决Vue中数组赋值无法渲染在页面的问题，关键在于： 1. 确保`this`指向正确，尤其是在异步操作中，可以使用箭头函数保持正确的上下文。 2. 使用Vue提供的数组变异方法（如`push()`、`splice()`等）来...
vue,遇到一个页面连续刷新两次的问题
weixin_43811713的博客
01-10 2713
父组件传一个复杂对象给子组件（浅克隆）,子组件有改动对象就会导致重新渲染，是什么问题
el-menu动态渲染问题
dbeidouxingf的博客
08-09 530
element ui对于菜单列表，可以使用el-menu 组件进行渲染，但是当渲染的列表会动态的变化时，会出现一定问题。
vue-router 三级菜单多次加载（onmounted）
xujing_06的博客
06-23 1857
1、使用了<keep-alive></keep-alive> 被包含在<keep-alive>中的组件，会多出两个生命周期钩子函数。 //被激活时执行=>onActivated() //比如从 A 组件，切换到 B 组件，A 组件消失时执行=>onDeactivated() 2、这时三级菜单就会多次onMounted 解决办法： 在三级里面嵌套 vue里面导入onActivated onActivated(()=>{ ..
vue中解决动态路由加载，刷新页面出现路由重复添加/出现空白页的问题
hahaha_1314的博客
03-25 8809
vue动态路由刷新页面后出现问题的处理
vue如何通过url携带token，并且打开新页面
在写作的路上持续输出。
01-04 7971
如何通过url 携带token，并且打开新标签页
vue mounted 调用两次的完美解决办法
12-13
在开发中发现其中一个页面moutned调用了两次，而其他页面正常，表示很懵逼，然后查找原因，终于找到了，其实归根到底是要知道mounted的调用机制问题； 情况：在这个页面中出现了mounted 加载了两次的情况； 方法：...
Vue在页面数据渲染完成之后的调用方法
10-18
总结一下，Vue中的`$nextTick`和`watch`配合使用可以很好地解决在数据渲染完成后执行特定操作的需求。通过`watch`监听数据变化，确保我们只在数据真正更新后执行相关逻辑，而`$nextTick`则确保这些逻辑在DOM更新后...
vue渲染时闪烁{{}}的问题及解决方法
08-27
Vue 渲染时闪烁{{}}的问题及解决方法 在日常开发中，v-if 和 v-show 是两个非常常用的指令，但是它们之间存在很大区别。下面我们将详细讲解 Vue 渲染时闪烁{{}}的问题及解决方法。 v-if 和 v-show 的区别 v-if 和...
关于keep-alive与router-view一起使用，子组件渲染两次
weixin_43914605的博客
12-08 4339
keep-alive、router-view动态路由一起使用出现的问题
Vue路由跳转至页面后多次渲染
最新发布
qq_32054169的博客
09-19 1721
Vue路由跳转至页面后多次渲染问题解决方案
vue：router-view二次渲染误操作
weixin_44241773的博客
02-10 1443
router-view二次渲染解决方法以及原因分析
JavaScript--location.href的跳转
weixin_30800987的博客
12-24 206
页面重载 true 强制从服务器加载 false 优先从缓存加载 window.location.reload(true); window.location.href、self.location.href、location.href是本页面跳转 parent.location.href 是上一层页面跳转 top.location.href 是最外层的页面跳转 ...
vue通过this.$router.push()跳转页面，页面不重新渲染
weixin_44705310的博客
09-10 3218
项目需求： 近期项目需要做个列表和详情页功能，采用vue组件方式，通过路由跳转传递不同的参数到详情页。发现只有第一次进入详情页的时候，页面执行了created，之后在进入页面就不会执行created，第二次之后页面数据不发生变化。 原因： 经过排查发现，详情页组件设置了name和其他组件name重复了，并且与详情页组件name相同的组件设置了keepActive:true， 所以详情页加载第一次之后，跳转到其他页面时并没有销毁，导致第二次进入不执行created。 解决办法： 改掉详情页的name
Vue组件缓存策略:如何避免组件多次渲染的问题?
禅与计算机程序设计艺术
07-01 5255
作者：禅与计算机程序设计艺术 Vue组件缓存策略:如何避免组件多次渲染的问题? 作为一位人工智能专家，作为一名程序员、软件架构师和CTO，我在日常工作中发现了一个令我们非常苦恼的问题:Vue组件在渲染过程中，为什么会出现多次渲染的情况呢？为了解决这个问题，我进行了深
vue中预渲染mounted执行了两次
05-01
在 Vue 中，当组件被渲染到页面上时，会依次执行 beforeCreate、created、beforeMount、mounted 四个生命周期函数。其中，mounted 表示组件已经被挂载到页面上。 如果一个组件中的 mounted 函数执行了两次，可能有以下原因： 1. 组件被异步加载，导致组件的 mounted 函数被多次执行。这时可以添加一个判断条件，防止重复执行 mounted 函数。 2. 在组件内部使用了 v-if 或 v-show 等条件渲染指令，导致组件在渲染后又被重新渲染了一次。这时可以把相关的代码移动到 created 函数里面执行。 3. 组件引用了其他组件，同时又在父组件中使用了 keep-alive 指令，导致组件被缓存，再次进入页面时会触发一次 mounted 函数。这时可以在 activated 函数里面执行需要执行的代码。 总之，如果组件的 mounted 函数执行了两次，需要仔细查找原因，分析代码逻辑，并且根据不同情况采取不同的解决方法。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值