浅析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 相关文章推荐
jquery下jstree简单应用 - v1.0
Apr 14 Javascript
chrome不支持form.submit的解决方案
Apr 28 Javascript
jQuery的ajax下载blob文件
Jul 21 Javascript
JS正则表达式修饰符global(/g)用法分析
Dec 27 Javascript
Angular2使用vscode断点调试ts文件的方法
Dec 13 Javascript
JS实现简单的浮动碰撞效果示例
Dec 28 Javascript
vue.js绑定事件监听器示例【基于v-on事件绑定】
Jul 07 Javascript
vue中使用codemirror的实例详解
Nov 01 Javascript
electron中使用bootstrap的示例代码
Nov 06 Javascript
详解ES6系列之私有变量的实现
Nov 21 Javascript
js实现拾色器插件(ColorPicker)
May 21 Javascript
解决vue字符串换行问题(绝对管用)
Aug 06 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
SONY SRF-40W电路分析
2021/03/02 无线电
[FAQ]PHP中的一些常识:类篇
2006/10/09 PHP
destoon复制新模块的方法
2014/06/21 PHP
laravel + vue实现的数据统计绘图(今天、7天、30天数据)
2018/07/31 PHP
jquery radio 操作代码
2011/03/16 Javascript
js 编程笔记 无名函数
2011/06/28 Javascript
jQuery自动切换/点击切换选项卡效果的小例子
2013/08/12 Javascript
JavaScript判断访问的来源是手机还是电脑,用的哪种浏览器
2013/12/12 Javascript
关于获取DIV内部内容报错的原因分析及解决办法
2016/01/29 Javascript
js实现商品抛物线加入购物车特效
2020/11/18 Javascript
在IE8上JS实现combobox支持拼音检索功能
2016/05/23 Javascript
让你一句话理解闭包(简单易懂)
2016/06/03 Javascript
jQuery实现的可编辑表格完整实例
2016/06/20 Javascript
JavaScript 中有关数组对象的方法(详解)
2016/08/15 Javascript
基于Vue实现timepicker
2017/04/25 Javascript
Vue自定义过滤器格式化数字三位加一逗号实现代码
2018/03/23 Javascript
理解 JavaScript EventEmitter
2018/03/29 Javascript
angularjs 的数据绑定实现原理
2018/07/02 Javascript
JavaScript函数的特性与应用实践深入详解
2018/12/30 Javascript
Python3使用requests登录人人影视网站的方法
2016/05/11 Python
python基于phantomjs实现导入图片
2016/05/13 Python
python 线程的暂停, 恢复, 退出详解及实例
2016/12/06 Python
python笔记:mysql、redis操作方法
2017/06/28 Python
Python3操作SQL Server数据库(实例讲解)
2017/10/21 Python
Python File(文件) 方法整理
2019/02/18 Python
基于python3 的百度图片下载器的实现代码
2019/11/05 Python
PyTorch中的Variable变量详解
2020/01/07 Python
django执行数据库查询之后实现返回的结果集转json
2020/03/31 Python
如何把外网python虚拟环境迁移到内网
2020/05/18 Python
PyTorch预训练Bert模型的示例
2020/11/17 Python
微信浏览器左上角返回按钮拦截功能
2017/11/21 HTML / CSS
爱祖国演讲稿
2014/05/04 职场文书
全国爱牙日活动总结
2015/02/05 职场文书
浪漫婚礼主持词开场白
2015/11/24 职场文书
Python办公自动化之教你如何用Python将任意文件转为PDF格式
2021/06/28 Python
Win11查看设备管理器
2022/04/19 数码科技