生命周期：
周期圖表
download.png
reated（創(chuàng)建后）,
beforeMount(載入前),
mounted（載入后）,
beforeUpdate（更新前）,
updated（更新后）,
beforeDestroy（銷毀前）,
destroyed（銷毀后）
vue生命周期定義：
Vue實(shí)例有一個(gè)完整的生命周期，也就是從開始創(chuàng)建、初始化數(shù)據(jù)、編譯模板、掛載Dom、渲染→更新→渲染、卸載等一系列過程，我們稱這是Vue的生命周期。通俗說就是Vue實(shí)例從創(chuàng)建到銷毀的過程，就是生命周期。
二非父子組件傳值
（1）：新建一個(gè)空的root組件:let Event=new Vue();
（2）:發(fā)送數(shù)據(jù)的組件：Event.on('a-fnName',(data)=>{}),注意函數(shù)格式必須寫為箭頭函數(shù)，不然this指向不是當(dāng)前組件
兩個(gè)獨(dú)立的組件不能進(jìn)行傳輸，需要借助第三方量；
在組件模板中不能同時(shí)存在兩個(gè)以上的兄弟元素；
例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<my-father></my-father>
<my-sun></my-sun>
</div>
<script>
var bus = new Vue()
Vue.component("my-father",{
template:`
<button @click="send">發(fā)送</button>
`,
data:function(){
return{
list:"hello vue"
}
},
methods:{
send:function(){
bus.$emit("head",this.list)
}
}
})
Vue.component("my-sun",{
template:`
<div>
<h1>{{mag}}</h1>
<h1>{{leta}}</h1>
</div>
`,
data:function(){
return{
mag:"",
leta:"組件B"
}
},
mounted:function(){
bus.$on("head",list=>{
this.mag=list
})
}
})
new Vue({
el:"#app",
})
</script>
</body>
</html>
