浅析Vue 生命周期


Posted in Javascript onJune 21, 2018

Vue 提供了11个钩子函数

1,从创建到销毁发生的一系列状态叫做什么周期,在这个过程中vue会提供状态函数给我们进行

该状态的操作,这个函数叫做钩子函数/生命周期函数/生命周期钩子

浅析Vue 生命周期

过程:

new Vue({})

Vue 实例初始化,读取所有的生命周期函数,并没有执行,不会调用

beforeCreate()

读取属性,计算属性,添加监听 set get方法,读取watch方法

create() 可以操作数据了

判断是否有el配置,或者是被调用了 $mount() 都会走下一步

判断有没有el或者是$mount()作用的dom结构

beforeMount是没有dom结构的

如果有dom结构,读取dom结构 渲染vue指令 {{}},也就是挂载的过程

mounted() 可以操作ref

在这里可以用到 ref操作dom,用法为 ref="id",this.$refs,这里的id为唯一值,手写id会覆盖,但是用v-for 遍历ref,id成了一个数组,不会覆盖。

总结

以上所述是小编给大家介绍的Vue 生命周期,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
理解JavaScript中的事件
Sep 23 Javascript
FireBug 调试JS入门教程 如何调试JS
Dec 23 Javascript
异步JavaScript编程中的Promise使用方法
Jul 28 Javascript
jQuery实现高亮显示网页关键词的方法
Aug 07 Javascript
浅谈jQuery中的$.extend方法来扩展JSON对象
Feb 12 Javascript
jQuery基于cookie实现换肤功能实例
Oct 14 jQuery
element-ui upload组件多文件上传的示例代码
Oct 17 Javascript
layui表格分页 记录勾选的实例
Sep 02 Javascript
vue多页面项目中路由使用history模式的方法
Sep 23 Javascript
vue-simple-uploader上传成功之后的response获取代码
Sep 07 Javascript
ant design vue导航菜单与路由配置操作
Oct 28 Javascript
JavaScript中关于预编译、作用域链和闭包的理解
Mar 31 Javascript
vue数组对象排序的实现代码
Jun 20 #Javascript
vue项目实现github在线预览功能
Jun 20 #Javascript
node thread.sleep实现示例
Jun 20 #Javascript
解决循环中setTimeout执行顺序的问题
Jun 20 #Javascript
Vue.use源码学习小结
Jun 20 #Javascript
Vuex入门到上手教程
Jun 20 #Javascript
JavaScript 中的 this 工作原理
Jun 20 #Javascript
You might like
Classes and Objects in PHP5-面向对象编程 [1]
2006/10/09 PHP
多重?l件?合查?(一)
2006/10/09 PHP
解决Yii2邮件发送结果返回成功,但接收不到邮件的问题
2017/05/23 PHP
PHP封装的PDO数据库操作类实例
2017/06/21 PHP
php 实现银联商务H5支付的示例代码
2019/10/12 PHP
在thinkphp5.0路径中实现去除index.php的方式
2019/10/16 PHP
有效的捕获JavaScript焦点的方法小结
2009/10/08 Javascript
一些实用的jQuery代码片段收集
2011/07/12 Javascript
JavaScript面向对象程序设计三 原型模式(上)
2011/12/21 Javascript
Ajax异步提交表单数据的说明及方法实例
2013/06/22 Javascript
js鼠标悬浮出现遮罩层的方法
2015/01/28 Javascript
Google 地图获取API Key详细教程
2016/08/06 Javascript
jquery将标签元素的高设为屏幕的百分比
2017/04/19 jQuery
vue.js实例对象+组件树的详细介绍
2017/10/20 Javascript
nodejs+mongodb+vue前后台配置ueditor的示例代码
2018/01/02 NodeJs
简述JS浏览器的三种弹窗
2018/07/15 Javascript
原生JS使用Canvas实现拖拽式绘图功能
2019/06/05 Javascript
javascript中call,apply,callee,caller用法实例分析
2019/07/24 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
SpringBoot+Vue开发之Login校验规则、实现登录和重置事件
2020/10/19 Javascript
vue组件添加事件@click.native操作
2020/10/30 Javascript
python实现udp数据报传输的方法
2014/09/26 Python
浅谈Python的Django框架中的缓存控制
2015/07/24 Python
详解重置Django migration的常见方式
2019/02/15 Python
django使用django-apscheduler 实现定时任务的例子
2019/07/20 Python
python实现在多维数组中挑选符合条件的全部元素
2019/11/26 Python
利用setuptools打包python程序的方法步骤
2020/01/18 Python
详解python环境安装selenium和手动下载安装selenium的方法
2020/03/17 Python
Pytorch 卷积中的 Input Shape用法
2020/06/29 Python
国外软件测试工程师面试题
2016/12/09 面试题
高三体育教学反思
2014/01/29 职场文书
贺卡寄语大全
2014/04/11 职场文书
村党支部书记承诺书
2014/05/29 职场文书
2014年图书馆工作总结
2014/11/25 职场文书
世界遗产的导游词
2015/02/13 职场文书
尼克胡哲观后感
2015/06/08 职场文书