浅析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 相关文章推荐
url 特殊字符 传递参数解决方法
Jan 01 Javascript
jQuery each()小议
Mar 18 Javascript
Extjs4中的分页应用结合前后台
Dec 13 Javascript
js document.write()使用介绍
Feb 21 Javascript
浅析node.js中close事件
Nov 26 Javascript
js使用递归解析xml
Dec 12 Javascript
JS实现仿google、百度搜索框输入信息智能提示的实现方法
Apr 20 Javascript
c#程序员对TypeScript的认识过程
Jun 19 Javascript
JS限制条件补全问题实例分析
Dec 16 Javascript
作为老司机使用 React 总结的 11 个经验教训
Apr 08 Javascript
详解Vue iview IE浏览器不兼容报错(Iview Bable polyfill)
Jan 07 Javascript
原生js实现trigger方法示例代码
May 22 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
PHP入门学习笔记之一
2010/10/12 PHP
php下通过IP获取地理位置的代码(小偷程序)
2011/06/09 PHP
PHP中比较两个字符串找出第一个不同字符位置例子
2014/04/08 PHP
PHP常见加密函数用法示例【crypt与md5】
2019/01/27 PHP
在laravel中实现将查询的对象转换为多维数组的函数
2019/10/21 PHP
JavaScript 空位补零实现代码
2010/02/26 Javascript
关于query Javascript CSS Selector engine
2013/04/12 Javascript
jQuery实现加入购物车飞入动画效果
2015/03/14 Javascript
js光标定位文本框回车表单提交问题的解决方法
2015/05/11 Javascript
基于javascript实现单选及多选的向右和向左移动实例
2015/07/25 Javascript
浅谈Sublime Text 3运行JavaScript控制台
2016/06/06 Javascript
bootstrap PrintThis打印插件使用详解
2017/02/20 Javascript
win系统下nodejs环境安装配置
2017/05/04 NodeJs
Vue的elementUI实现自定义主题方法
2018/02/23 Javascript
React Router v4 入坑指南(小结)
2018/04/08 Javascript
jQuery实现图片简单轮播功能示例
2018/08/13 jQuery
详解微信小程序图片地扯转base64解决方案
2019/08/18 Javascript
vue实现前端列表多条件筛选
2020/10/26 Javascript
JavaScript语法约定和程序调试原理解析
2020/11/03 Javascript
python opencv之SURF算法示例
2018/02/24 Python
Python 数据处理库 pandas 入门教程基本操作
2018/04/19 Python
Python绘制并保存指定大小图像的方法
2019/01/10 Python
Python3日期与时间戳转换的几种方法详解
2019/06/04 Python
python 梯度法求解函数极值的实例
2019/07/10 Python
Django REST framework 如何实现内置访问频率控制
2019/07/23 Python
keras处理欠拟合和过拟合的实例讲解
2020/05/25 Python
CSS3关于z-index不生效问题的解决
2020/02/19 HTML / CSS
Christys’ Hats官网:英国帽子制造商
2018/11/28 全球购物
新奥尔良珠宝:Mignon Faget
2020/11/23 全球购物
自我鉴定思想方面
2013/10/07 职场文书
团员学习总结的自我评价范文
2013/10/14 职场文书
企业管理毕业生求职信
2014/03/11 职场文书
2014年廉洁自律承诺书
2014/05/26 职场文书
运动会主持人开幕词
2016/03/04 职场文书
Python基础数据类型tuple元组的概念与用法
2021/08/02 Python
python blinker 信号库
2022/05/04 Python