天天看點

Vue的生命周期(鈎子函數)

vue的生命周期為開始建立、初始化資料、編譯模闆、挂載dom、渲染、更新、再渲染到銷毀的過程

在vue建立執行個體時需要傳入一個選項參數對象,下面時一個鈎子函數

(1)created()函數:執行個體履歷完成後使用。

(2)mounted()函數:el挂載到執行個體上之後調用。

(3)beforedestroy()函數:執行個體被銷毀之前使用。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		
	</head>
	<body>
		<div id="app">
			<p>{{title}}</p>
		</div>
	</body>
	<script src="js/vue.js"></script>
	<script>
		var em=new Vue({
			el:"#app",
			data:{
				title:"nihao"
			},
			created:function(){
				this.title="生命周期鈎子函數";
				console.log("created()鈎子函數執行");
			},
			mounted:function(){
				console.log(this.$el);
				console.log("title的值",this.$el);
				console.log("mounted()執行");
				
			}
		})
	</script>
</html>
           
Vue的生命周期(鈎子函數)

繼續閱讀