VUE中created被重复调用(每次进入页面之后都会调用created)

最新推荐文章于 2024-05-14 09:56:08 发布
最新推荐文章于 2024-05-14 09:56:08 发布
阅读量4.3k 收藏 4
点赞数 2
文章标签： 前端 开发语言 vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_51756019/article/details/127052494
版权

项目中部分页面是正常会缓存的 重复调用created的那个页面没有被缓存 设置不被缓存是通过设置 meta: { keepAlive: false} 项目中router中压根没有设置 后来对比有缓存和没有缓存的俩个页面发现页面中的一个有name 另一个没写name如图所示:
1有缓存的页面:
在这里插入图片描述
2.没有缓存的页面:
在这里插入图片描述
压根没有name 后来设置的name之后就可以正常缓存了
切记设置name必须跟url名字相同
例如:
在这里插入图片描述
在这里插入图片描述
介样子问题就解决了!!

Static～
关注
  • 2
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
vue的根文件main.js里的created和mounted执行两次（vue-wechat-title 动态设置网页标题造成加载两次）
fendoudemayi159的博客
06-19 3357
有时项目需要设置标题，要是不设置的话展示的是访问的地址。 未改前： 最近的一个项目搭建的时候由于需要去监听路由并存储到本地。发现每次切换、刷新页面的时候都会出现加载三次的情况。 bug处理： 既然出现了问题，那么怎么解决呢？首先百度、google了一下vue多次加载mainjs和如何加载的问题。发现没有什么实际性作用。项目打包后在服务器预览也是没有任何问题。另外将谷歌开发者模式关闭手机模式后，通过网页预览，点击也是没有任何问题。在确保mainjs中的内容无误的情况下，去查看了app.vue,如下图：
vue 所有生命周期函数都执行了两遍的问题
no pains,no gains
06-16 5802
在原有项目新增功能需求模块开发的过程中，发现无论哪一个模板中的created函数都被执行了两次，遂非常熟练的打开了百度… 网络上的解决办法有： 解决方案1：检查main.js 中是否重复声明vue实例 （没有, pass） 解决方案2：据说使用了mixin的会调用两次 （尝试用一个干净的vue项目，使用一个简单的mixin文件，发现并没有执行两遍，把本项目的app文件其他内容全都注释，只留纯净的初始版本，发现也会调用两次。pass） 解决方案3：说什么路由配置问题（直接注掉路由的引用，还是调用了两遍，.
vue 进入页面每次都调用methods里的方法
qq_39750019的博客
06-16 5511
需求：每次一进入页面都调用methods里的方法 监控路由 2.在methods里的写getPathFun方法
vue中每次进入页面都会刷新,导致用户体感不好
最新发布
weixin_55518113的博客
05-14 185
进行页面切换，并且每次切换都会重新渲染组件。缓存组件，这样切换到其他页面时，被缓存的组件不会重新渲染。Vue中进入页面刷新通常是由于使用了。2.在路由配置中，可以设置。字段来控制是否需要缓存。
vue切换tab更新路由created执行两次
小方块的世界
08-19 3893
问题描述 element-admin中使用tab切换到不同的路由，发现每次切换tab路由都会执行两次生命周期 <tabs :tabs="tabs" v-model="activeName" @on-switch="handleSwitch" > <components :is="activeName"></components> </tabs> 问题分析 Vue官网上提供了一个动态组件 <component :is="c
VUE的creat方法异步执行
yanglq_的博客
06-04 1464
遇见的问题是发现有个方法时灵时不灵 created() { //Vue的creat方法是异步的 this.getUser(); this.getApplyInfo(); }, methods: { getUser(){ getCurrentUsUser().then(response =>{ this.modifyInformationForm = response.data }); } getApplyInfo(){
vue中实现在外部调用methods的方法(推荐)
11-28
2.在事件当前的组件中，在created中，用$on向公共的组件eventHub传递，translate是自定义的，getCardNum(data)是要在外部调用的方法; eventHub.$on('translate', function (data) { that.getCardNum(data); }); ...
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
01-19
在项目中遇到后台数据还没有加载完毕，但是页面上调用了后台数据中的字段，这样就会报undefined。 例如：一进入页面直接回显数据。 我在created里面请求接口进行赋值 this.matterAll=[]; 会报accessItemName为...
在vue中created、mounted等方法使用小结
10-15
- `created`钩子在Vue实例被创建后立即调用，但此时DOM还未渲染。在这个阶段，你可以进行数据初始化、异步数据获取或者设置监听器等操作。由于DOM尚未生成，所以无法直接访问或操作DOM元素。 2. **`mounted`**： ...
vue 路由子组件created和mounted不起作用的解决方法
10-16
今天小编就为大家分享一篇vue 路由子组件created和mounted不起作用的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue created，mounted多次执行
qq_46126127的博客
02-26 1821
原因是tab里for循环会渲染 解决方式 不是当前标签不渲染
解决nuxt页面中mounted、created、watch执行两遍的问题
01-21
前言： 在开发中偶然检查Network请求的时候发现，在页面中created钩子函数中请求了一个接口，但是页面这个页面加载的时候，接口会连续请求两边，然后我就排查是否有其他地方调用了同样的接口，检查了好几遍后发现并没有，WTF，然后我在created中打印了一下，惊奇的发现。。。created会执行两次打印。。。 WTF、WTF、WTF，小朋友你是否有很多问号？？？，然后试了下，不光created会执行两遍，mounted也行，就连watch里面监听的也会，握草（草是一种植物），此处省略我咔咔排查了一个小时各种删除各种排查的步骤。。。 得出以下结论： 第一种： 页面布局不合理，会导致执行两遍，
vue进入页面每次执行_Vue学习笔记之路由的keep-alive应用及技巧
weixin_34739646的博客
01-26 9660
keep-alive的应用：作用：keep-alive是Vue内置的一个组件，可以使比包含的组件保留状态，或避免重新渲染，而router-view也是一个组件，如果直接被包在keep-alive里面，所有的路径匹配到的视图组件都会被缓存。生命周期：· 初次进入时：created > mounted > activated；退出后触发 deactivated· 再次进入：会触发 acti...
Nuxt.js使用VUE生命周期钩子函数重复调用接口问题(created()调用两次)
xiaosong2001的博客
11-06 5737
Nuxt.js使用VUE生命周期钩子函数重复调用接口问题(created()调用两次) 解决问题前要先了解客户端渲染和服务端渲染的区别 1、客户端渲染 简单理解就是，在服务端放一个html 页面，客户端发起请求，服务端把页面发送过去。客户端从上到下依次解析，如果发现ajax请求就再发送新的请求，拿到ajax 响应结果以后渲染模板引擎。整个过程至少要发起两次请求。如图： 但是，这种渲染方式存在的弊端也是不容忽视的，比如请求量大时首屏渲染慢，不利于seo等问题。服务端渲染恰好弥补了这些不足。 2. 服务端渲染
vue路由在使用keep-alive缓存之后第二次进入页面created和mounted不执行问题及解决
jieyucx的博客
06-14 6946
Vue.js中keep-alive是一个内置组件，可以在需要缓存的组件上添加keep-alive标签，使得这个组件被缓存起来，不会被多次渲染和销毁。keep-alive组件有两个独立的生命周期钩子，分别是activated和。
Vue路由第二次进入页面后created和mounted不执行
weixin_65915562的博客
07-18 1926
通过以上方法，可以确保在Vue路由中多次进入同一个页面时，导航守卫来确保在路由进入组件之前执行相应的代码。导航守卫：在组件定义时，通过。钩子函数都能被正确执行。
vue开发问题积累
qq_41913971的博客
07-28 245
mounted钩子中使用$refs出现undefined 原因：如果在DOM结构中的某个DOM节点使用了v-if、v-show或者v-for（即根据获得的后台数据来动态操作DOM，即响应式），那么这些DOM是不会再mounted阶段找到的。 **解决方法：**如果说mounted阶段是加载阶段，那么updated阶段则是完成了数据更新到DOM的阶段。在update阶段使用this.$refs.xxx，就100%能找到该DOM节点。 ...
Vue.js在页面加载时执行某个方法
热门推荐
leaves_story的博客
04-16 13万+
jQuery中可以这样写vue中，如果要达到相同效果，可以使用vue的生命周期函数，如create或者mounted附上vue.js的生命周期函数执行流程
vue生命周期执行两次的debug之路
qq_36545095的博客
12-28 5267
版本：vue3.2 说明：本文仅代表其中一种可能的情况，仅作为参考 1.bug最初的地方(使用了setup语法糖) 网上查找资料，v-if可能会导致onMounted执行两次。 计划方案： a.v-if替换为v-show,未解决； b.onMounted换成其他生命周期，比如created,仍未解决。 2.偶然发现整个setup语法糖内都会执行两次，如下： 查看编译后源码发现，setup语法糖会编译为setup()，即setup()执行了两次。 3.考虑可能父组件中存在v-if..
vue 写一个刷新页面禁止调用created
05-17
首先，在Vue中，created生命周期函数是在实例创建之后立即调用的。因此，如果你想在刷新页面时禁止调用created函数，你需要将逻辑写在其他生命周期函数中。 一个比较好的选择是使用mounted生命周期函数，它会在实例挂载后调用，而不是在实例创建之后立即调用。这样，当你刷新页面时，Vue会在mounted函数中重新渲染组件，而不是调用created函数。 以下是一个示例代码： ``` <template> <div> <!-- 页面内容 --> </div> </template> <script> export default { mounted() { // 在这里写你的逻辑 } } </script> ``` 注意，如果你想在每次路由切换时都执行逻辑，可以考虑使用beforeRouteUpdate或watch来监听路由变化。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值