Vue2-生命周期

一、生命周期:

1.1.关于生命周期,vue2.自带有8个

beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destroyed、

1.2.一旦进入组件会执行那些生命周期?

beforeCreate、created、beforeMount、mounted、

第一个钩子函数执行完,我们访问不到dom节点和我们的data数据、第二个和第三个钩子函数执行完时,

我们可以拿到data数据,但是dom还没有,只有当mounted执行时,我们才能访问到节点和数据。

1.3父组件引入子组件,那么生命周期执行的顺序是?

父亲:beforeCreate、created、beforeMount、

然后执行,子的beforeCreate、created、beforeMount、mounted,

。。。。。。。多个子组件时,

最后执行父亲的mounted。、

1.4发生请求为什么不在beforeCreate里?

把请求放在四个钩子函数的任何一个里面都是最后执行,由于事件循环机制,发送请求是异步的,而四个钩子函数都是同步的,那为什么不在beforeCreate里呢,因为我们一般发送请求数据在页面中会获取多次的话,我们会将我们的请求封装成一个方法,直接去调用即可,那如果这样的话,在beforeCreate中就会访问不到methods中的方法,就会报错。

created中能够访问到data,所以也能够访问methods,所以一般发送请求都在created中或者mounted中。

1.5.在created中如何获取dom?

只要写异步代码,获取dom在异步中就可以,因为在这个阶段直接拿dom是拿不到,因为还没挂载上去,我们同步去访问获取不到,所以写异步代码,最后执行都会拿到。例如:setTimeout、请求、Promise.xxx()等等,

或者使用vue内置的this.$nextTick();

通过给dom设置ref,通过this.$refs.去访问dom;

1.6.发送请求在created和mounted中有什么区别?

这个问题具体看项目和业务情况,由于组件的加载顺序,先执行父的前三个钩子函数,然后执行子的四个钩子函数,最后执行父的mounted,所以如果我们的业务是父组件引入子组件,并且优先加载子组件中的数据,那么在父组件中当前的请求要放在mounted中, 如果当前组件没有依赖关系,那么放在哪里都可以。

1.7.加入keep-alive会执行那些生命周期?

activated、deactivated ,

如果使用了keep-alive组件,当前组件会额外增加两个钩子函数,

如果当前组件加入了keep-alive,第一次进入这个组件会执行5个钩子函数,加上activated;

1.8 第二次或者第n次进去组件会执行那些生命周期呢?

如果当前组件加入了keep-alive,只会执行一个生命周期activated。

如果没有加入keep-alive。一直会执行前四个。都会重新渲染。

1.9 你在什么情况下用过那些生命周期,说一说生命周期的使用场景?

created ===> 单组件请求,没有父子之间的依赖关系,可以在这个里面发送请求 
mounted ===>同步获取dom,如果先子组件请求后父组件请求,我们就需要在父组件发送请求放在这个里面 
activated ===>keep-alive 缓存组件,当组件内容相同时,执行缓存的内容,不同时,发起请求 destroyed ===> 关闭页面记录视频播放的时间,用户退出,再次进入的时候,可以从上次历史开始播放

二、关于组件

你可能感兴趣的:(前端,javascript,vue.js)