Vue之生命周期mounted、activated区别及实际运用例子解析

mounted：是挂载vue实例后的钩子函数，钩子在主页挂载时执行一次，如果没有缓存的话，再次回到主页时，此函数还会执行activated：是组件被激活后的钩子函数，每次回到页面都会执行实际运用：页面1、列表页面读取后台返回的列表数据，调用 mounted页面第一次会加载读取回来的列表数据，再返回会继续读取缓存的数据2、如果列表页面增加了一个新增的调整页面，新增提交成功后，返回页面，则需要增加 a

水晶草720

8924人浏览 · 2020-08-10 16:42:06

水晶草720 · 2020-08-10 16:42:06 发布


mounted：是挂载vue实例后的钩子函数，钩子在主页挂载时执行一次，如果没有缓存的话，
再次回到主页时，此函数还会执行

activated：是组件被激活后的钩子函数，每次回到页面都会执行

实际运用：
页面
在这里插入图片描述

1、列表页面读取后台返回的列表数据，调用 mounted 页面第一次会加载读取回来的列表数据，再返回会继续读取缓存的数据

2、如果列表页面增加了一个新增的调整页面，新增提交成功后，返回页面，则需要增加 activated 读取列表

 mounted: function() {
        this.getList();
},
activated() {
     this.getList();
 },

beforecreate : 举个栗子：可以在这加个loading事件
created ：在这结束loading，还做一些初始化，实现函数自执行
mounted ：在这发起后端请求，拿回数据，配合路由钩子做一些事情
beforeDestroy：你确认删除XX吗？ destroyed ：当前组件已被删除，清空相关内容