new Vue({
????????el:'#app',//要控制的容器
????????template:'',//組件調(diào)用標簽
????????components:{App}//注冊的組件 名稱來自import引入時的名字
})
組件嵌套方式
1蜈亩，全局注冊
????????(1).在main.js中import引入
????????(2).在new Vue 的上方
????????????????Vue.component("組件的name",引入時定義的名字);
????????(3).在需要的位置用組件中name的名字做標簽使用
2在塔，局部注冊
????????(1).在需要的父級組件的script內(nèi)export外跛梗，import引入
????????(2).在其export的components對象中添加注冊铐料，名字是引入時定義的名字
????????(3).在需要的位置用組件中name的名字做標簽使用
組件的style上加scoped表示樣式作用域
傳值：string number boolean ???????傳值僅僅會在單一操作的組件上發(fā)生變化
引用：array object ???????????????????????????傳引用會導致全部的數(shù)據(jù)變化
父子屬性傳值：
父向子傳值：
1.在子組件的標簽上v-bind:自定義屬性名=“傳值名”，
2.在子組件內(nèi)sxport中props：[“自定義屬性名”]
props應(yīng)寫成標準寫法：
props：{
自定義屬性名：{
type： Array镀梭，//數(shù)據(jù)類型
required:true, //
}
}
事件傳值（子向父傳值）：
1.在子組件中定義事件猾编，用this.$emit("自定義的事件名", "傳遞的內(nèi)容");
2.在父級組件中的調(diào)用標簽上綁定事件v-on:子組件中定義的事件名="父組件中要執(zhí)行的事件($event)"進行接收；
3.在父級的methods中定義事件接收
父級事件名（形參）{
this.要改變的參數(shù)名=形參朱灿；
}
生命周期
????new Vue（）實例化vue對象；
在完成之前會有一個beforeCreate钠四，它僅對事件進行一個配置盗扒，這時可以進行一個加載的動畫；用此鉤子函數(shù)缀去；
之后進入到created侣灶，這時候?qū)嵗瓿桑M件創(chuàng)建完成缕碎，屬性成功綁定褥影，但Dom并沒有生成，頁面并沒有展示出來咏雌；這里可以獲取對應(yīng)的一些數(shù)據(jù)凡怎，結(jié)束上邊鉤子的例子；如停止加載動畫赊抖，準備渲染DOM统倒；
之后會查看當前有沒有el（element）屬性，
有氛雪，往下房匆；
沒有，查看有沒有$mount（）报亩，
有浴鸿，往下，
沒有弦追，生命周期結(jié)束岳链。
之后會檢查有沒有template屬性
有，template中執(zhí)行一個具體的組件骗卜，執(zhí)行render方法渲染template里對應(yīng)的內(nèi)容
沒有宠页，生命周期結(jié)束；
之后beforeMount寇仓，編譯template方法举户，在虛擬DOM中執(zhí)行，頁面還是看不到內(nèi)容
之后是mounted遍烦，beforeMount之后編譯的模板放入頁面俭嘁，mounted時模板編譯完成，開始掛載服猪；mounted結(jié)束頁面就會顯示出來供填；如有頁面顯示出來之后需要做的拐云，放在此方法里
頁面顯示完成了，組件也掛載了近她，此時對項目做一些更改（增刪改查）叉瘩；會觸發(fā)下一個鉤子函數(shù)Update
????beforeUpdate：當前組件在更新之前的鉤子
????updated：組件在更新之后的鉤子；此鉤子執(zhí)行之后粘捎，頁面就是更新之后的樣子
beforeDestroy：組件實例銷毀之前薇缅；
distroyed：組件實例銷毀之后；
??methods: {},
??beforeCreate: function() {
????alert("組件實例化之前執(zhí)行的函數(shù)");
??},
??created: function() {
????alert("組件實例化完畢攒磨，但頁面還未顯示");
??},
??beforeMount: function() {
????alert("組件掛載前泳桦，頁面仍未展示，但虛擬Dom已經(jīng)配置");
??},
??mounted: function() {
????alert("組件掛載后娩缰，此方法執(zhí)行后頁面顯示");
??},
??beforeUpdate:function(){
????alert("組件更新前,頁面仍未更新灸撰，但虛擬Dom已經(jīng)配置");
??},
??updated:function(){
????alert("組件更新后，頁面顯示更新后的組件");
??},
??beforeDestroy:function(){
????alert("組件銷毀前");
??},
??destroyed:function(){
????alert("組件銷毀");
??}
路由和http
共享網(wǎng)絡(luò)接口：http://jsonplaceholder.typicode.com/
安裝resource模塊 指令：npm install vue-resource --save-dev
router下的index.js中配置
引入：
import Router from 'vue-router'
import VueResource from 'vue-resource'
Vue.use(Router)
Vue.use(VueResource)
mode: "history", //在router上邊使用這個是去除鏈接上初始的#
routes: [
????{
??????path: '/', ?????//根路徑
??????name: 'HelloWorld',
??????component: HelloWorld拼坎，//此處是引入時的起的名字
??????children：[
??????{
??????????????path: '/home', ?????//路徑 ?嵌套字路由
??????????????name: 'HelloWorld',
??????????????component: HelloWorld浮毯，//此處是引入時的起的名字
??????}
??????]
????}
??]
在組件中的鉤子函數(shù)中請求
??created(){
????this.$http.get("http://jsonplaceholder.typicode.com/users")
????????.then((data)=>{
??????????console.log(data);
??????????this.users=data.body;
????????})
??}
