生命周期：
beforecreate ：
一般使用場景是在加 loading事件 的時候
created ：
處於loading結束后，還做一些初始化，實現函數自執行（data數據已經初始化，但是DOM結構渲染完成，組件沒有加載）
beforemount ：
處於組件創建完成，但未開始執行操作
mounted ：
處於發起后端請求，獲取數據，配合路由鈎子執行操作（DOM渲染完成，組件掛載完成 ）
beforeupdate、updated ：
處於數據更新的前后
beforeDestroy ：
當前組件還在的時候，想刪除組件
destroyed ：
當前組件已被銷毀，清空相關內容
created 與 mounted 的區別
created ：
在模板渲染成html前調用，即通常初始化某些屬性值，然后再渲染成視圖。
mounted ：
在模板渲染成html后調用，通常是初始化頁面完成后，再對html的dom節點進行一些需要的操作。
mounted 與 methods 的區別
mounted ：
是生命周期方法之一，會在對應生命周期時執行。
methods ：
是Vue實例對象上綁定的方法，供當前Vue組件作用域內使用，未調用不會執行，只執行邏輯，返回值可有可無。
computed 與 watched 的區別
computed ：
是計算屬性，也可以理解為一個方法。其中計算的結果如果不發生改變就不會觸發，且必須返回一個值並在DOM中綁定的才能取得值。他可以自動獲取數據的改變。
watched ：
屬性是手動定義的所需監聽的值，不同的數據可以在其中多次定義監聽值，這時會消耗一定性能，他並不能像computed那樣自動改變。
<script>
let vm=new Vue({
el:"#app",
data:{
name:"onceweb"
},
beforeCreate(){
console.log("創建之前")
console.log(this.$el)
console.log(this.$data)
},
created(){
console.log("成功創建")
console.log(this.$el)
console.log(this.$data)
},
beforeMount(){
console.log("掛載之前")
console.log(this.$el)
console.log(this.$data)
},
mounted(){
console.log("成功掛載")
console.log(this.$el)
console.log(this.$data)
},
beforeUpdate(){
console.log("更新之前")
let name = this.$refs.app.innerHTML
console.log('name:'+name)
},
updated(){
console.log("成功更新")
let name = this.$refs.app.innerHTML
console.log('name:'+name)
},
beforeDestory(){
console.log("銷毀之前")
},
destoryed(){
console.log("成功銷毀")
}
});
</script>