码迷,mamicode.com
首页 > Web开发 > 详细

keep-alive优化网页性能

时间:2018-06-29 20:34:47      阅读:281      评论:0      收藏:0      [点我收藏+]

标签:请求   http   src   没有   次数   image   font   获取   分享   

  1. 每次当点击城市页面的按钮跳转到首页都会请求一次数据,这就造成了性能低,

我们在app.vue里面给 显示的内容包上 keep-alive

技术分享图片

2、每次点击城市取对应的数据渲染到首页

技术分享图片

这时候再点击城市页面跳转到首页 获取城市数据的问题 出现了(没有发送请求了,只请求求了第一次的数据),因为keep-alive将数据内容缓存起来了 他直接去取了缓存的内容

技术分享图片

 

解决:

 当我们在使用 keep-alive组件的时候 vue里面会多出一个生命周期函数 activated 函数,

这个函数在每次跳转页面的时候会执行。

技术分享图片

 

技术分享图片

 

keep-alive优化网页性能

标签:请求   http   src   没有   次数   image   font   获取   分享   

原文地址:https://www.cnblogs.com/warbj/p/9245037.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!