每个Vue实例被创建后都要经历初始化过程。在这个过程中也会运行一些叫做生命周期钩子的函数,方便用户在不同阶段进行不同的代码实现。

1.Created

  在实例创建完成后立即执行的函数。

<!DOCTYPE html>
<html> <head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/vue.js"></script>
</head> <body>
</body>
<script>
var vm = new Vue({
data: {
mess: "Hellow"
},
created: function() {
console.log(this.mess);
}
})
</script> </html>

这里可以看见当输出了我们data里面的mess。这里出现的this是指向调用它的 Vue 实例,在这里他指向的是vm

2.生命周期图示(图片来自Vue教程)

Vue中的钩子的更多相关文章

  1. vue中的钩子函数的理解

    接下来我们对几个钩子函数进行解释 beforeCreated:这个钩子函数实在vue实例创建后,触发的.这个时候还没有进行data里的数据监听和事件的初始化 其实大家很多时候都会在created钩子函 ...

  2. 【转】vue中的钩子函数。。

    前言 在vue开发SPA应用的过程中,多数情况下我们需要解决一个问题 就是在路由跳转的过程中需要更新你SPA应用的 title , 这一节不说其他,就展示如何使用 vue-router 的 导航钩子  ...

  3. [Vue]vue中各选项及钩子函数执行顺序

    在vue中,实例选项和钩子函数和{{}}表达式都是不需要手动调用就可以直接执行的. 一.生命周期图示 二.vue中各选项及钩子函数执行顺序 1.在页面首次加载执行顺序有如下: beforeCreate ...

  4. Vue 中的生命周期和钩子函数

    生命周期: beforeCreate:el 和 data 并未初始化 (此方法不常用) created:完成了 data 数据的初始化,el的初始化未完成.用来发送ajax beforeMount:( ...

  5. vue中使用keepAlive组件缓存遇到的坑

    项目开发中在用户由分类页category进入detail需保存用户状态,查阅了Vue官网后,发现vue2.0提供了一个keep-alive组件. 上一篇讲了keep-alive的基本用法,现在说说遇到 ...

  6. Vue.js-11:第十一章 - Vue 中 ref 的使用

    一.前言 在之前的前端开发中,为了实现我们的需求,通常采用的方案是通过 JS/Jquery 直接操纵页面的 DOM 元素,得益于 Jquery 对于 DOM 元素优异的操作能力,我们可以很轻易的对获取 ...

  7. vue 中监测滚动条加载数据(懒加载数据)

    vue 中监测滚动条加载数据(懒加载数据) 1:钩子函数监听滚动事件: mounted () { this.$nextTick(function () { window.addEventListene ...

  8. vue 中的translation操作----动态值

    在vue中,也会遇见translate的情况,这里顺带也可以带上如何查找页面中的元素的案例. 1.在加载过程中,有会遇见加载顺序先后的问题,然后查找页面元素null的情况,所以在mounted的钩子函 ...

  9. 【转】简单理解Vue中的nextTick

    前言: Vue中的nextTick涉及到Vue中DOM的异步更新,感觉很有意思,特意了解了一下.其中关于nextTick的源码涉及到不少知识,很多不太理解,暂且根据自己的一些感悟介绍下nextTick ...

随机推荐

  1. UBIFS FAQ and HOWTO

    转:http://www.linux-mtd.infradead.org/faq/ubifs.html UBIFS FAQ and HOWTO Table of contents How do I e ...

  2. RSA体系 c++/java相互进行加签验签--转

    在web开发中,采用RSA公钥密钥体系自制ukey,文件证书登陆时,普遍的做法为:在浏览器端采用c++ activex控件,使用 c++的第三库openssl进行RAS加签操作,在服务器端采用java ...

  3. 微信企业号开发遇到的bug

    a. 微信嵌入视频: a.1 视频元素播放时层级默认被顶置 a.1 视频播放后窗口无法通过css改变层级 a.2 视频播放后窗口无法通过css隐藏 解决方案:做个虚假的播放窗口,点击播放窗口(虚假的) ...

  4. Radmin远程控制软件

    Radmin远程控制软件 日期:2015-08-20     作者:lujl   Radmin是一款快速的远程控制软件,可以用来远程管理公司或个人计算机来实现远程办公.你可以通过鼠标和键盘来控制远程的 ...

  5. Keil MDK从未有过的详细使用讲解

    转自博客:http://blog.csdn.net/zhzht19861011/article/details/5846510 这博主关于MDK 的使用的文章,写的得TM的好  TM的实用! 真心收藏 ...

  6. java简单的双色球摇号程序

    import java.util.HashSet; import java.util.Random; import java.util.Set; /** * LotteryClient * @auth ...

  7. Magento 2 Plugin - Interceptor - Magento 2插件 - 拦截器-插件开发

    Magento 2 Plugin - Interceptor - Magento 2插件 - 拦截器 Magento 2 Plugin is a technical plugin for your b ...

  8. HDFS详解

    HDFS详解大纲 Hadoop HDFS 分布式文件系统DFS简介 HDFS的系统组成介绍 HDFS的组成部分详解 副本存放策略及路由规则 命令行接口 Java接口 客户端与HDFS的数据流讲解 目标 ...

  9. Poj3984 迷宫问题 (BFS + 路径还原)

    Description 定义一个二维数组: int maze[5][5] = { 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 0, ...

  10. 20135337朱荟潼 Linux第七周学习总结——可执行程序的装载

    朱荟潼 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 第七周 Linu ...