一、创建(实例)

1、beforeCreate:这个阶段实例已经初始化,只是数据观察与事件机制尚未形成,不能获取DOM节点(没有data,没有el)

使用场景:因为此时data和methods都拿不到,所以通常在实例以外使用

2、created:实例已经创建,仍然不能获取DOM节点(有data,没有el)

使用场景:模板渲染成html前调用,此时可以获取data和methods,so 可以初始化某些属性值,然后再渲染成视图,异步操作可以放在这里

二、载入(数据)

1、beforeMount:是个过渡阶段,此时依然获取不到具体的DOM节点,但是vue挂载的根节点已经创建(有data,有el)

2、mounted:数据和DOM都已经被渲染出来了 使用场景:模板渲染成html后调用,通常是初始化页面完成后再对数据和DOM做一些操作,需要操作DOM的方法可以放在这里

三、更新

1、beforeUpdate:检测到数据更新时,但在DOM更新前执行

2、updated:更新结束后执行

使用场景:需要对数据更新做统一处理的;如果需要区分不同的数据更新操作可以使用$nextTick

四、销毁

1、beforeDestroy:当要销毁vue实例时,在销毁前执行

2、destroyed:销毁vue实例时执行

" />
微信公众号
扫描关注微信公众号

最新动态

vue路由钩子函数有哪些及其作用

在 Vue.js 中,Vue Router 提供了一系列钩子函数(也称为导航守卫),允许你在路由跳转的不同阶段执行特定的逻辑。这些钩子函数可以帮助你进行权限验证、数据预取、页面跳转控制等操作。

JSON数据处理以及常用方法

JSON数据处理涉及多个方面,包括JSON字符串与JavaScript对象的转换、使用reviver函数和replacer参数控制转换过程以及在Java中使用常见的JSON处理库等。熟练掌握这些方法和技巧对于高效处理JSON数据至关重要。

JavaScript中什么是任务队列?

任务队列是JavaScript事件循环机制的关键组成部分,用于管理异步任务的执行顺序。理解宏任务和微任务的区别及其执行顺序,对于编写高效、无阻塞的JavaScript代码至关重要。

如何理解JavaScript的单线程?

JavaScript的单线程特性简化了代码逻辑并避免了并发导致的复杂性。然而,它也带来了一些挑战和问题。通过理解和合理运用JavaScript的异步处理机制和Web Workers API,我们可以打造出既高效又用户友好的应用程序。

js中复制对象时如何避免引用依赖?

在 JavaScript 中,当你复制一个对象时,如果不使用正确的方法,新对象和原对象之间可能会存在引用依赖。这意味着新对象中的属性如果是对象类型(如数组、对象等),那么它们仍然会引用相同的内存地址,导致对新对象的修改会影响到原对象。

Vue组件间通信的方式有几种?

Vue组件间通信的方式多种多样,可以根据具体场景和需求选择合适的通信方式。在实际开发中,可能会结合使用多种通信方式来实现复杂的功能。

css3动画 transition 和 animation 的区别?

CSS3中的transition和animation各有其独特的优势和适用场景。transition适合实现简单的平滑过渡效果,而animation则更适合实现复杂的动画效果。在选择使用哪种动画方式时,应根据具体需求和场景进行权衡。

网站如何禁止用户通过F12访问开发者工具?

在网页中完全禁止用户通过F12键访问开发者工具是不可能的,因为这些功能是由用户的浏览器控制的,而不是由网页本身控制的。不过,网站开发者可以采取一些措施来增加用户访问开发者工具的难度。

什么是原型、原型链它们有什么作用?

原型和原型链在JavaScript中具有重要的作用和意义,它们不仅可以实现属性和方法的共享和继承,还可以简化对象的创建和维护,提高代码的复用性和可维护性。对于理解和掌握JavaScript的面向对象编程,深入了解原型和原型链是非常重要的。

点击穿透对用户有哪些影响?

点击穿透对用户的影响是多方面的,包括意外的交互行为、操作失误的增加、任务完成效率的降低、信任度和满意度的下降以及潜在的安全风险。因此,开发者需要重视点击穿透问题,并采取相应的措施来降低其对用户的影响。