4.Vue 生命周期的使用，路由的实现（路由模式、路由传参），keep-alive 的理解

最新推荐文章于 2024-08-18 16:55:31 发布

xingnan.

最新推荐文章于 2024-08-18 16:55:31 发布

阅读量1.4k

点赞数

分类专栏： Vue 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/qq_39035580/article/details/123469047

版权

本文详细介绍了Vue.js的生命周期，包括beforeCreate、created、beforeMount、mounted等阶段，以及如何在不同阶段操作数据和DOM。同时，讨论了Vue路由的实现，包括hash模式和history模式，以及params和query的传参方式。此外，深入解析了keep-alive组件的作用，用于组件缓存，避免重复渲染，提升性能，并提到了activated和deactivated两个特殊生命周期。

摘要由CSDN通过智能技术生成

1.Vue 生命周期的使用

1.beforeCreate(){}
　　创建前，访问不到data当中的属性以及methods当中的属性和方法，可以在当前生命周期创建一个loading，在页面加载完成之后将loading移除

2.created(){}
　　创建后，当前生命周期执行的时候会遍历data中所有的属性，给每一个属性都添加一个getter、setter方法,将data中的属性变成一个响应式属性

3. beforeMount(){}
　　模板与数据进行结合，但是还没有挂载到页面上。因此我们可以在当前生命周期中进行数据最后的修改

4.mounted(){}
　　当前生命周期数据和模板进行相结合，并且已经挂载到页面上了，因此我们可以在当前生命周期中获取到真实的DOM元素

5. beforeUpdate(){}
　　当数据发生改变的时候当前生命周期就会执行，因此我们可以通过当前生命周期来检测数据的变化
　　当前生命周期执行的时候会将更新的数据与模板进行相结合，但是并没有挂载到页面上，因此我们可以在当前生命周期中做更新数据的最后修改

6.updated(){}
　　数据与模板进行相结合ÿ