VUE 生命周期理解

2020-03-25  本文已影响0人  呢一妮呢啊娜

【一些概念理解】

vue组件,就是vue将能复用的部分进行封装

生命周期,一个VUE对象从创建到销毁的过程(8个过程)

生命周期用来干什么:状态监控和步骤回调

当生命周期触发了相应的钩子函数,就会调用到相关方法执行动作;就是进入一个页面,在这个组件开始创建、初始化数据、编译、挂载、渲染 、销毁这些时间点里执行动作,每个函数有对应执行的时间

挂载:我们把React.js 将组件渲染,并且构造 DOM 元素然后塞入页面的过程称为组件的挂载

DOM:https://www.jianshu.com/p/a469774d819b

【声明周期过程及应用】

1.beforeCreate(常用):组件创建之前触发,这时组件还没创建,可以在这加载loading动画

2.created(常用):组件创建完毕,这时组件创建完成,但还没有挂载,页面上没有展示组件;可以在这里1)请求后端接口赋给属性2)结束loading加载

3.beforeMount:组件挂载之前,编译并准备挂载,内容还没渲染到页面上,此时页面上看不到内容

4.mounted(常用):组件挂载完毕,DOM生成,可以在这里1)页面出来之后获取数据,如发送ajax请求2)配合路由做些控制

5.beforeUpate:组件更新之前

6.upated:组件更新完毕,执行完后页面是更新后的展示效果,组件需要发生改变一般在这里用

7.beforeDestoy(常用):组件销毁之前,可以在这里做删除操作确认

8.destoyed(常用):组件销毁完毕,当前组件已删除,清空相关初始化内容

【mounted和created区别】

created:组件还没展示之前需要拿到后端数据???

mounted:组件展示之后需要拿到后端数据???

参考:https://www.bilibili.com/video/av88726353/https://www.bilibili.com/video/av89278053

上一篇 下一篇

猜你喜欢

热点阅读