在使用vue.js进行开发时,使用最多的就是created、mounted、activated。

  由于有些情况下,我们需要复用某些组件,因此需要用到keep-alive。

  当引入keep-alive时,页面第一次进入,钩子的触发顺序是created-> mounted-> activated。当再次进入该页面时,只触发activated。

  因此,应该activated中留一份数据获取的代码,或者不要created部分,直接将created中的代码转移到activated中。

  created: 实例已经创建完成之后被调用,在刚进入页面的时候,会触发该函数的方法。只在页面刚开始加载时执行一次。

  mounted:页面加载完成后会执行该方法。

  activated:keep-alive组件激活时调用。也就是当页面存在缓存时调用。

vue.js生命周期钩子函数及缓存的更多相关文章

  1. vue之生命周期钩子函数之运用

    一.什么是生命周期钩子函数: 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等.同时在这个过程中也会运行 ...

  2. vue的生命周期钩子函数

    一.vue生命周期图示 二.钩子函数执行时间 beforeCreate      在创建实例之前,data只声明但没有赋值  在实例初始化之后,数据观测 (data observer) 和 event ...

  3. VUE的生命周期——钩子函数

  4. 关于 vue 生命周期 钩子函数 事件

    vue实例有一个完整的生命周期,也就是从开始创建.初始化数据.编译模板.挂载Dom.渲染->更新->渲染.卸载等一系列过程,我们称这是vue的生命周期. 通俗的将就是vue实例从创建到销毁 ...

  5. Vue生命周期 钩子函数和组件传值

    Vue生命周期 钩子函数 每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听.编译模板.将实例挂载到 DOM 并在数据变化时更新 DOM 等. 同时在这个过程中也会运行一 ...

  6. vue生命周期图示中英文版Vue实例生命周期钩子

    vue生命周期图示中英文版Vue实例生命周期钩子知乎上近日有人发起了一个 “react 是不是比 vue 牛皮,为什么?” 的问题,Vue.js 作者尤雨溪12月4日正面回应了该问题.以下是尤雨溪回复 ...

  7. Vue 组件生命周期钩子

    Vue 组件生命周期钩子 # 1)一个组件从创建到销毁的整个过程,就称之为组件的生命周期 # 2)在组件创建到销毁的过程中,会出现众多关键的时间节点, 如: 组件要创建了.组件创建完毕了.组件数据渲染 ...

  8. 对vue生命周期/钩子函数的理解

    对于实现页面逻辑交互等效果,我们必须知晓vue的生命周期,才能愉快的玩耍,知道我们写的东西应该挂载到哪里,vue官方给出的api讲解的那叫一个简单啊,如下: 所有的生命周期钩子自动绑定this上下文到 ...

  9. VueRouter和Vue生命周期(钩子函数)

    一.vue-router路由 1.介绍 vue-router是Vue的路由系统,用于定位资源的,在页面不刷新的情况下切换页面内容.类似于a标签,实际上在页面上展示出来的也是a标签,是锚点.router ...

随机推荐

  1. socketserver实例化过程

    一.创建server对象时__init__的执行 找继承中的__init__ 这是ThreadingMixIn类中的方法 这是TCPServer类中的方法(父类BaserServer中还会用到fini ...

  2. 2019.01.21 bzoj1758: [Wc2010]重建计划(01分数规划+长链剖分+线段树)

    传送门 长链剖分好题. 题意简述:给一棵树,问边数在[L,R][L,R][L,R]之间的路径权值和与边数之比的最大值. 思路: 用脚指头想都知道要01分数规划. 考虑怎么checkcheckcheck ...

  3. Windows上使用Git管理文件

    今天在搜索ffmpeg相关资料时,需要通过.sh脚本文件下载git上的代码文件,最后通过在Windows上安装了git,并在git.bash中执行bash ffmpeg.sh解决了代码下载问题,顺便学 ...

  4. DocumentFragment类型

    nodeType 11 nodeName #document-fragment nodeValue NULL parentNode null createdocumentfragment()方法创建了 ...

  5. GPS 编程笔记

    1.在GPS系统内,经纬度的显示方式一般都可以根据自己的爱好选择,一般有"hddd.ddddd"(度.度),"hddd*mm.mmm"(度.分. 分),&quo ...

  6. Silverlight中图片显示

    silverlight中显示一个图片有很多的中方法,xaml中的image控件或者自定编写程序来生成image控件. silverlight中显示的图片只能是Bitmap, JPG, PNG(64位颜 ...

  7. Redis-4.0.11集群配置

    版本:redis-3.0.5 redis-3.2.0  redis-3.2.9  redis-4.0.11 参考:http://redis.io/topics/cluster-tutorial. 集群 ...

  8. Ng第九课:神经网络的学习(Neural Networks: Learning)

    9.1  代价函数 9.2  反向传播算法 9.3  反向传播算法的直观理解 9.4  实现注意:展开参数 9.5  梯度检验 9.6  随机初始化 9.7  综合起来 9.8  自主驾驶 9.1   ...

  9. (暴力 记录)Camellia的难题 -- zzuli -- 1784

    http://acm.zzuli.edu.cn/problem.php?id=1784 Camellia的难题 Time Limit: 2 Sec  Memory Limit: 128 MBSubmi ...

  10. js中对String去空格

    str为要去除空格的字符串: 去除所有空格: str = str.replace(/\s+/g,""); 去除两头空格: str = str.replace(/^\s+|\s+$/ ...