一、created()

在创建vue对象时,当html渲染之前就触发;

但是注意,全局vue.js不强制刷新或者重启时只创建一次,

也就是说,created()只会触发一次;

二、activated()

在vue对象存活的情况下,进入当前存在activated()函数的页面时,一进入页面就触发;可用于初始化页面数据等

也就是说activated每次进页面都刷新,

所以一般查询列表、刷缓存的方法 要写在activated中,

就是为了数据刷新,不然编辑或其他操作后返回 数据不刷新

vue中keep-alive和activated需要相互搭配使用,keep-alive可能会封装,我们封装到component: RouteView  这个布局中,只有使用才会生效

具体测试可以参考:https://blog.csdn.net/qq_38861711/article/details/98185106

三、案例

没必要刷新的,就放上面created()

需要刷新的,就放到下面activated()

 

vue钩子函数的妙用之“created()和activated()”的更多相关文章

  1. vue 钩子函数 使用async await

    示例: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <tit ...

  2. Vue钩子函数生命周期实例详解

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

  3. Vue钩子函数

    Vue的生命周期函数 beforeCreate:function(){ console.log('1-beforeCreate 初始化之后'); }, created:function(){ cons ...

  4. vue 钩子函数的使用

    1.什么是自定义指令,有哪些钩子函数及自定义指令的使用场景 ①自定义指令是什么?以及自定义指令的使用场景 在Vue中,有很多内置指令,但是这些指令只能满足我们最基础的使用,当我们在实际项目中遇到了必须 ...

  5. vue 钩子函数的初接触

    vue-router的路由钩子函数: 第一种:全局钩子函数. router.beforeEach((to, from, next) => { console.log('beforeEach') ...

  6. VUE钩子函数created与mounted区别

    created:在模板渲染成html前调用,即通常初始化某些属性值,然后再渲染成视图. mounted:在模板渲染成html后调用,通常是初始化页面完成后,再对html的dom节点进行一些需要的操作.

  7. vue 钩子函数

    beforeRouteEnter 方法名称: beforeRouteEnter 调用时机: 切换路由之前,调用该方法时,页面还没有切换 next调用时机: activated 之后 注意事项: thi ...

  8. vue 钩子函数中获取不到DOM节点

    原文链接:https://jingyan.baidu.com/article/f96699bbfe9c9d894f3c1b4b.html 两种解决方案: 1:官方解决方案: 受到 HTML 本身的一些 ...

  9. Vue的钩子函数[路由导航守卫、keep-alive、生命周期钩子]

    前言 说到Vue的钩子函数,可能很多人只停留在一些很简单常用的钩子(created,mounted),而且对于里面的区别,什么时候该用什么钩子,并没有仔细的去研究过,且Vue的生命周期在面试中也算是比 ...

随机推荐

  1. 【C# .Net GC】垃圾回收算法 应用程序线程运行时,

    触发垃圾回收算法的条件 触发垃圾回收的条件 当满足以下条件之一时将发生垃圾回收: 操作系统报告低内存请看(将触发第2代垃圾回收). 这是通过 OS 的内存不足通知或主机指示的内存不足检测出来. 由托管 ...

  2. centos网络配置、虚拟机克隆

    查看网卡命令: ifconfig 查看网络配置 ifconfig -a 查看隐藏网卡 window下使用ipconfig 网络配置 设置静态IP,修改/etc/sysconfig/network-sc ...

  3. rlwrap的使用

    转至:http://blog.itpub.net/429786/viewspace-776177/ 在LINUX下使用ORACLE一些命令时(如sqlplus,rman等),经常需要调用上次或之前运行 ...

  4. 3D打印第二弹:狗牌

    给朋友做一个狗牌(误,给朋友的狗狗做一个狗牌 1. 设计 没有设计功底,看看别人是如何做的,搜到一个狗牌: 照着这个做一个,正面是上图这种的:狗狗名字+狗爪子:另一面是手机号加联系说明文字. 2. 建 ...

  5. 资源管理模式:Evictor模式

    Evictor模式描述了何时以及如何释放资源以优化资源管理.这个模式让我们可以配置不同的策略来自动决定哪些资源应该释放,以及应该在什么时候释放. 实例 考虑一个网络管理系统--管理多个网络元素.这些网 ...

  6. 安装xpath helper方便进行爬虫

    安装xpath helper方便进行爬虫 因为我使用的是edge浏览器,扩展商店搜索不到xpath-helper,但是我不甘心,取下载源扩展直接放在edge中试试 下载XPath helper的源码 ...

  7. MM32F0020 UART1中断接收和UART1中断发送

    目录: 1.MM32F0020简介 2.初始化MM32F0020 UART1和NVIC中断 3.编写MM32F0020 UART1使能中断发送函数 4.编写MM32F0020 UART1中断接收和中断 ...

  8. Azure KeyVault(四)另类在 .NET Core 上操作 Secrets 的类库方法-----Azure.Security.KeyVault.Secrets

    一,引言 上一篇文章我们在 .Net Core Web 项目中添加了 "Microsoft.Azure.KeyVault" 的 Nuget 包操作 Azure KeyVault 的 ...

  9. 学习c语言时对一些疑问的测试

    #include<stdio.h>#include<string.h> int main(){/* 1 */// int a[3][3]={6,1,2,3,4,5};// in ...

  10. Logstash-CentOS7单机安装测试

    目录 环境&准备 安装&启动 简单配置一下,看看效果 Conf配置文件参考 完成 环境&准备 下面所有操作都基于CentOS7 官网下载安装包 logstash下载 如官网打不 ...