当前位置: 首页 > Web前端 > vue.js

Vue中created和mounted的区别

时间:2023-03-31 20:48:18 vue.js

简单理解一下区别:1.created方法是在页面初始化之前对dom的操作。2、mounted方法是页面初始化后对dom的操作。为什么会有这样的区分?因为有些需求只能在页面加载后请求,比如id,js使用了document.getElementById("xxx")的形式来详细了解生命周期钩子函数生命周期钩子组件状态最佳实践beforeCreate实例后初始化后,this指向创建的实例,无法访问data、computed、watch、methods上的方法和数据。它通常用于初始化非响应变量。创建的实例已创建,可以访问数据、计算、监视和方法。上面的方法和数据都没有挂载到DOM上,$el属性是访问不到的。$ref属性的内容是一个空数组,常用于简单的ajax请求。页面的初始化beforeMount在挂载开始之前调用,beforeMount会找到对应的模板,编译成render函数挂载实例挂载到DOM上。这时可以通过DOMAPI获取DOM节点,访问$ref属性。常用于获取VNode信息和操作。当ajaxrequestsbeforeupdateresponsedataupdate虚拟DOM打补丁前调用,适用于更新前访问已有的DOM,比如手动移除添加的事件监听更新虚拟DOM重新渲染打补丁后调用,组件DOM已经更新,而可执行文件依赖于DOM操作,避免了在这个钩子函数中操作数据,可能会陷入死循环。BeforeDestroy在销毁实例之前被调用。这一步,实例还是完全可用的,这个还是可以拿到实例的。常用于销毁定时器、解绑全局事件、销毁插件对象等操作。被销毁的实例在被销毁后被调用。调用后,Vue实例指示的所有内容都将被解除绑定。所有事件侦听器都将被删除,所有子实例都将被销毁-