教育培训消费

机构数据分析培训之Vue生命周期详解

0回复 阅读 25

1.生命周期分类

在大数据中,vue的每个组件都是独立的,每个组件都有一个属于它的生命周期

从一个组件中创建和初始化数据,挂载,更新,销毁,这就是所谓的组件生命周期组件中的具体方法有:

beforeCreate

created

beforeMount

mounted

beforeUpdate

updated

beforeDestroy

destroyed

2、beforeCreate(创建前)

实例初始化后,在数据观察和事件配置前调用。这时候组件的option对象还没有被创建,el和data也没有被初始化,所以method、data、computed等上的方法和数据是无法访问的。

3、created(创建后)

实例创建后调用。这一步,实例已经完成了如下配置:数据观察,属性和方法的计算,watch/Event事件回调,完成了数据数据的初始化,el没有。但是,挂起阶段还没有开始,$el 属性目前是不可见的。这是一个常见的生命周期,因为你可以在method中调用方法,在data中修改数据,通过vue的reactive binding来修改。在页面上,在computed等中获取计算得到的属性,通常我们可以在这里对实例进行预处理

4,beforeMount(挂载前)

hang before the start 当它是调用,第一次调用相关render函数(虚拟DOM),示例完成了如下配置: 编译模板,从data和data中的模板生成html,完成el和data的初始化,注意说明此时还没有链接到 html 页面。

5、mounted(挂载后)

挂载完成,即模板中的HTML渲染到HTML页面。这时候一般可以做一些ajax操作,mounted只执行一次。

6、beforeUpdate(更新前)

数据更新前调用,发生在虚拟DOM重新渲染和打补丁之前。可以使用这个钩子进一步改变进程中的状态不会触发额外的重新渲染进程

7、更新(updated)

在虚拟 DOM 由于数据变化只能调用重新渲染和修补。调用时,组件 DOM 已更新,因此可以执行依赖于 DOM 的操作。那么在大多数情况下,您应该避免在此期间更改状态,因为这可能会导致无限更新循环。服务端渲染时不调用此钩子

8、beforeDestroy(销毁前)

实例销毁前调用,实例仍完全可用,这个你也可以用它一步获取实例。一般会在这一步做一些reset操作,比如清除组件中的定时器和监听的dom事件

9、销毁(After destroy)

实例销毁后调用。调用后,所有事件侦听器将被删除,所有子实例也将被销毁。在服务器端渲染期间不会调用此钩子

以上就是关于之Vue生命周期的讲解,如果想了解更多详情,请点击成都加米谷大数据官网吧!、大数据开发培训、数据分析与挖掘,零基础班本月正在招生中,课程大纲及试学视频可联系客服获取!

标签

Vue 大数据 大数据培训
展开全文
一键安装官方客户端
江城热点及时推送 阅读体验更流畅

值得推荐

首页 版块

和武汉妹子交朋友

了解武汉的窗口

在武汉结婚  买房  装修  旅游  购物

用得意生活app有优惠

立即下载