Vue之keep-alive
这是一个优化的点,每次进入页面就重新渲染DOM然后再获取数据更新DOM,这样会使接口请求变多,页面加载变慢。在APP首屏上我们比较要求速度,我们可以加入keep-alive生命周期钩子顺序是 mounted -- created --- updated ---destroyed 当我们加入keep-alive 之后 只有首次进入页面才会 将生命周期钩子全部走完,再次进入生命周期,不会去执行
·
这是一个优化的点,每次进入页面就重新渲染DOM然后再获取数据更新DOM,这样会使接口请求变多,页面加载变慢。在APP首屏上我们比较要求速度,
我们可以加入keep-alive
生命周期钩子顺序是 mounted -- created --- updated ---destroyed 当我们加入keep-alive 之后 只有首次进入页面才会 将生命周期钩子全部走完,再次进入生命周期,不会去执行 mounted -- created 直接去执行 updated 这样我们可以使用watch 去观察数据的变化数据变化后在updated 钩子进行更新,这样可以大大提高页面的加载效率不用每次都去走接口,如果是数据特别大的情况下,可以大大提高页面加载速度。
<template><divclass="app"><keep-alive><router-view></router-view></keep-alive></div></template>
更多推荐
已为社区贡献4条内容
所有评论(0)