# 练习 7:生命周期和异步更新 ## 目标 学会在合适的生命周期里加载数据,并理解页面更新的时机。 ## 你要练什么 - `created` - `mounted` - `updated` - `beforeDestroy` - `destroyed` - 模拟异步请求 ## 任务 请基于页面结构完成以下操作: - 进入页面时显示 loading - 在 `mounted` 里模拟异步获取课程数据 - 数据返回后渲染课程列表 - 在 `updated` 里输出更新日志 - 点击按钮时销毁当前实例,并观察销毁日志 ## 文件 - [starter.html](/Users/lijiaqing/home/wwwroot/front-end-example/07-vue2/07-lifecycle-and-async/starter.html) - [starter.js](/Users/lijiaqing/home/wwwroot/front-end-example/07-vue2/07-lifecycle-and-async/starter.js) - [answer.html](/Users/lijiaqing/home/wwwroot/front-end-example/07-vue2/07-lifecycle-and-async/answer.html) - [answer.js](/Users/lijiaqing/home/wwwroot/front-end-example/07-vue2/07-lifecycle-and-async/answer.js)