Vue組件之間傳值以及promise介紹

今日重點：
一、Vue組件之間傳值
1、父組件向子組件傳值
①父組件是以屬性的形式綁定值到子組件身上, 可以傳遞多個。
②然后子組件用屬性props接收
③在props中使用駝峰形式，模板中需要使用短橫線的形式 字符串形式的模板中沒有這個限制

（1）props: 命名規則
①在props中使用駝峰形式, 模板中需要使用短橫線的形式 因為 HTML 對大小寫不敏感, 所以使用短橫線的形式
②字符串形式的模板中沒有這個限制

（2）props 屬性值類型
** 通過屬性綁定傳遞 原始數值 否則就會傳遞字符串**

2、子組件向父組件傳值
（1）子組件用$emit()觸發事件
（2）$emit() 第一個參數為 自定義的事件名稱 第二個參數為需要傳遞的數據
（3）父組件用v-on 監聽子組件的事件
（4）注意:子組件 $emit 觸發的事件名稱 必須 和 監聽事件 的名稱 保持一致
3、$emit 攜帶參數情況

4、兄弟之間的傳遞
（1）兄弟之間傳遞數據需要借助於事件中心，通過事件中心傳遞數據
提供事件中心 var hub = new Vue()
（2）傳遞數據方，通過一個事件觸發hub.$emit(方法名，傳遞的數據)
（3）接收數據方，通過mounted(){} 鈎子中 觸發hub.$on()方法名
（4）銷毀事件 通過hub.$off()方法名銷毀之后無法進行傳遞數據
（5）在 mounted 中監聽事件
二、組件插槽
（1）組件的最大特性就是復用性，而用好插槽能大大提高組件的可復用能力 => 父組件向子組件傳遞內容
（2）聲明插槽時 => 在子組件 模板中 預留 slot 標簽
（3）使用是 組件標簽內的內容 會自動的傳遞給 插槽

1、具名插槽
（1）具有名字的插槽
（2）使用 slot 中的 "name" 屬性綁定元素
（3）在使用時 根據 插槽的名稱 進行內容的傳遞

2、作用域插槽
（1）父組件對子組件的內容進行加工處理
（2）既可以復用子組件的slot，又可以使slot內容不一致

三、購物車案例
四、接口調用方式
1、原生ajax
2、基於jQuery的ajax
3、fetch => RESTful 接口設計規范，用於 Web 數據接口的設計。
4、axios
五、異步
1、JavaScript的執行環境是「單線程」
2、所謂單線程，是指JS引擎中負責解釋和執行JavaScript代碼的線程只有一個，也就是一次只能完成一項任務，這個任務執行完后才能執行下一個，它會「阻塞」其他任務。這個任務可稱為主線程
3、異步模式可以一起執行多個任務
4、JS中常見的異步調用
（1）定時任務
（2）ajax
（3）事件函數
nodemon 安裝命令: npm install -g nodemon
六、promise
（1）主要解決異步深層嵌套的問題
（2）promise 提供了簡潔的API 使得異步操作更加容易

1、基於Promise發送Ajax請求

2、promise 返回值
在then方法中，你也可以直接return數據而不是Promise對象，在后面的then中就可以接收到數據了

有關Vue數組操作以及組件應用 請點擊a=href"https://www.cnblogs.com/kk199578/p/14393997.html"