vue对象的生命周期

硅谷探秘者 2007 0 0

vue笔记参考:http://www.jiajiajia.club/search?str=vue

vue对象的生命周期

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/vue.min.js"></script>
	</head>
	<body>
		<div id="app">
			<button @click="kill">销毁vue对象</button>
			<p v-show="isShow">显示</p>
		</div>
		<script>
			var v=new Vue({
				el:'#app',
				data:{
					isShow:true
				},
				/***
				 * 初始化阶段
				 * **/
				beforeCreate(){
					console.log("创建之前执行");
				},
				created(){
					console.log("创建之后执行");
				},
				beforeMounted(){
					console.log("beforeMounted");
				},
				mounted(){//mounted回调函数在 初始化页面显示之后立即调用
					console.log("页面初始化显示之后执行");
					this.interid=setInterval(() => {
						console.log("---")
						this.isShow=!this.isShow
					},1000)
				},
				
				/***
				 * 更新阶段
				 * **/
				beforeUpdate(){
					console.log("beforeUpdate");
				},
				
				updated(){
					console.log("updated");
				},
				
				/***
				 * 销毁阶段
				 * ***/
				beforeDestroy(){//vm对象死亡之前调用此方法
					console.log("销毁之前执行");
					clearInterval(this.interid);
				},
				destroyed(){//死亡之后执行
					console.log("destroyed");
				},
				methods:{
					kill(){
						//销毁vue对象
						this.$destroy();
					}
				}
			})
		</script>
	</body>
</html>



评论区
请写下您的评论...
暂无评论...
猜你喜欢
weblog 1516 vue!DOCTYPEhtmlhtml head metacharset="UTF-8" title/title scriptsrc="js/vue.min.js"/script
spring/springmvc 1591 bean什么SpringBean在整个Spring中占有很重要位置,从BeanFactory或ApplicationContext取得实例为Singleton,也就是预设为每一个
official 580   Bean描述是Spring中一个Bean创建过程和销毁过程中所经历步骤,其中Bean创建过程是重点。程序员可以利用Bean机制Bean进行自定义加工。
weblog 3901 vue使用v-for遍历数组和遍历splic(...)方法使用请参考:http://www.jiajiajia.club/blog/artical/262!DOCTYPEhtmlhtml
java基础 2903 asm实例方法调用1.需要jar包2.我们需要通过asm目标类如下:packageclub.jiajia.test3;publicclassExamp5
spring/springmvc 1362 service层添加事物。这些操作spring都会自动帮我们成代理。当我们需要在spring容器启动后获取ioc容器中时,这个时候获取确实代理了。已经不是我们了。这时再去获取
java虚拟机(jvm) 2139 这里以HotSpot为例,且所说指普通Java,不包括数组和Class等。参考资料深入理解java虚拟机《志明》1.内存布局HotSpot虚拟机中,在内存中存储布局可以
框架 3861 springboot请求json数据不返回指定字段在实体类字段上加上注解importcom.fasterxml.jackson.annotation.JsonIgnore;例
归档
2018-11  12 2018-12  33 2019-01  28 2019-02  28 2019-03  32 2019-04  27 2019-05  33 2019-06  6 2019-07  12 2019-08  12 2019-09  21 2019-10  8 2019-11  15 2019-12  25 2020-01  9 2020-02  5 2020-03  16 2020-04  4 2020-06  1 2020-07  7 2020-08  13 2020-09  9 2020-10  5 2020-12  3 2021-01  1 2021-02  5 2021-03  7 2021-04  4 2021-05  4 2021-06  1 2021-07  7 2021-08  2 2021-09  8 2021-10  9 2021-11  16 2021-12  14 2022-01  7 2022-05  1 2022-08  3 2022-09  2 2022-10  2 2022-12  5 2023-01  3 2023-02  1 2023-03  4 2023-04  2 2023-06  3 2023-07  4 2023-08  1 2023-10  1 2024-02  1 2024-03  1
标签
算法基础 linux 前端 c++ 数据结构 框架 数据库 计算机基础 储备知识 java基础 ASM 其他 深入理解java虚拟机 nginx git 消息中间件 搜索 maven redis docker dubbo vue 导入导出 软件使用 idea插件 协议 无聊的知识 jenkins springboot mqtt协议 keepalived minio mysql ensp 网络基础 xxl-job rabbitmq haproxy srs 音视频 webrtc javascript
目录
没有一个冬天不可逾越,没有一个春天不会来临。最慢的步伐不是跬步,而是徘徊,最快的脚步不是冲刺,而是坚持。