Vue中mounted和created的区别
生命周期钩子 | 组件状态 | 最佳实践 |
---|---|---|
beforeCreate | 实例初始化之后,this指向创建的实例,不能访问到data、computed、watch、methods上的方法和数据 | 常用于初始化非响应式变量 |
created |
实例创建完成,可访问data、computed、watch、methods上的方法和数据,未挂载到DOM,不能访问到$el属性,$ref属性内容为空数组 | 常用于简单的ajax请求,页面的初始化 |
beforeMount | 在挂载开始之前被调用,beforeMount之前,会找到对应的template,并编译成render函数 | - |
mounted |
实例挂载到DOM上,此时可以通过DOM API获取到DOM节点,$ref属性可以访问 | 常用于获取VNode信息和操作,ajax请求 |
beforeupdate | 响应式数据更新时调用,发生在虚拟DOM打补丁之前 | 适合在更新之前访问现有的DOM,比如手动移除已添加的事件监听器 |
updated | 虚拟 DOM 重新渲染和打补丁之后调用,组件DOM已经更新,可执行依赖于DOM的操作 | 避免在这个钩子函数中操作数据,可能陷入死循环 |
beforeDestroy | 实例销毁之前调用。这一步,实例仍然完全可用,this仍能获取到实例 | 常用于销毁定时器、解绑全局事件、销毁插件对象等操作 |
destroyed | 实例销毁后调用,调用后,Vue 实例指示的所有东西都会解绑定,所有的事件监听器会被移除,所有的子实例也会被销毁 | - |
Vue中mounted和created的区别相关推荐
- VUE中computed 、created 、mounted 的先后顺序
VUE中computed .created .mounted 的先后顺序 1.computed .created .mounted 的先后顺序 created => computed => ...
- vue方法调用失败后多次调用_浅析Vue中 computed / watch / methods的区别
思考:请说下Vue中computed 和 watch 的区别( 面试题 ) 构造选项 computed / watch / methods computed ● computed 起初构想 在Vue的 ...
- mounted钩子函数_怎样实现Vue中mounted钩子函数获取节点高度
这次给大家带来怎样实现Vue中mounted钩子函数获取节点高度,实现Vue中mounted钩子函数获取节点高度的注意事项有哪些,下面就是实战案例,一起来看一下. 遇到的问题 最近在开发一个Vue的项 ...
- Vue 生命周期中 mounted( ) 和 created( ) 的区别
前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,忍不住分享一下给大家.点击跳转到教程. 一.什么是生命周期? 用通俗的语言来说,就是Vue中实例或者组件从创建到消灭中间经过的一系列过程.虽 ...
- Vue生命周期中mounted和created的区别
一.什么是生命周期? 用通俗的语言来说,就是Vue中实例或者组件从创建到消灭中间经过的一系列过程.虽然不太严谨,但是也基本上可以理解. 通过一系列实践,现在把所有遇到的问题整理一遍,今天记录一下cre ...
- 9.Vue中mounted的简单理解
mounted是vue中的一个钩子函数,一般在初始化页面完成后,再对dom节点进行相关操作.官方文档的解释如下,钩子函数的官方链接为 https://cn.vuejs.org/v2/api/# ...
- vue中params和query的区别,以及具体用法
query传递参数会在url后面用?连接起来,且参数之间用&&符号连接然后显示在页面的url中:params传递参数不会显示在页面中:query有点像ajax中的get请求,而para ...
- Vue 中 computed vs methods的区别
computed:计算属性 methods:方法 watch:侦听器 computed与methodes区别 1.computed是响应式的,methods并非响应式. 2.调用方式不一样,compu ...
- vue中runtimecompiler和runtimeonly的区别
简单总结 如果在之后的开发中,你依然使用template,就需要选择runtimecompiler 如果你之后的开发中,使用的是.vue文件夹开发,那么可以选择runtimeonly runtimec ...
最新文章
- activexobject java_JS进阶篇--IE浏览器的ActiveXObject对象以及FileSystemobject的应用扩展...
- 从一道题浅说 JavaScript 的事件循环
- CentOS 7安装使用Github
- linux下手动删除数据库实例
- linux使用iscsi磁盘的几个步骤
- 爱因斯坦那颗大脑,究竟隐藏了什么
- 【react】---组件传值的介绍
- 全网首发:JDK绘制文字:一、绘制流程
- 中国移动MM如何助力网络视频反盗版
- Java员工管理系统
- 17.1.1 颜色和 RGBA 值
- 【BFS】大胖子走迷宫
- Z05 - 006、网站转化以及漏斗分析(转化分析)
- thinkphp6 404找不到网页错误常见情况总结(持续更新)
- 历史上神秘消失的10天 | 历史全知道
- 安川伺服电机采用位脉冲+符号控制方式的接线与设置
- 李健清华计算机专业,李建-西南石油大学 - 计算机科学学院
- Spring IOC 容器源码分析
- C# 打印PPT幻灯片
- 格式化输出,浮点数e,f,g保留位数的计算方式不同,e,f :%.3e/f:取小数点后三位,g:%.3g总共有效位数为3,不包括小数点
热门文章
- Java-Collection、List
- [暴力]JZOJ 5842 a
- cts测试linux指令skip,linux – dd命令中seek和skip之间有什么区别?
- keras faster物体检测_全网 | 深度学习目标检测算法(精选12篇)
- Nginx+Tomcat无法正确获取的域名和ip地址
- php提交失败阻止提交数据,php – 在刷新浏览器时阻止重新提交提交
- invalid LOC header(bad signature)错误及解决
- [JS进阶] JS 之Blob 对象类型
- Chrome , Firfox 对应IE fireEvent 的方法
- php本地文件包含漏洞,php文件包含漏洞利用小结