一個(gè) Vue 應(yīng)用由一個(gè)通過 new Vue 創(chuàng)建的根 Vue 實(shí)例，以及可選的嵌套的、可復(fù)用的組件樹組成。

then()方法是異步執(zhí)行
就是當(dāng).then()前的方法執(zhí)行完后再執(zhí)行then()內(nèi)部的程序

import 語句 用于從一個(gè)已經(jīng)導(dǎo)出的外部模塊或另一個(gè)腳本中導(dǎo)入函數(shù)，對象或原始類型。
import命令具有提升效果，會提升到整個(gè)模塊的頭部，首先執(zhí)行。
由于import是靜態(tài)執(zhí)行，所以不能使用表達(dá)式和變量，這些只有在運(yùn)行時(shí)才能得到結(jié)果的語法結(jié)構(gòu)。

export 語句 用于從給定的文件 (或模塊) 中導(dǎo)出函數(shù)，對象或原語。
export命令除了輸出變量，還可以輸出函數(shù)或類（class）。
export語句輸出的接口，與其對應(yīng)的值是動態(tài)綁定關(guān)系，即通過該接口，可以取到模塊內(nèi)部實(shí)時(shí)的值。
axios

export default命令，為模塊指定默認(rèn)輸出。
第一組是使用export default時(shí)，對應(yīng)的import語句不需要使用大括號；第二組是不使用export default時(shí)，對應(yīng)的import語句需要使用大括號。
本質(zhì)上，export default就是輸出一個(gè)叫做default的變量或方法，然后系統(tǒng)允許你為它取任意名字。
export default命令其實(shí)只是輸出一個(gè)叫做default的變量，所以它后面不能跟變量聲明語句。

生命周期
created
mounted
updated
destroyed

父子組件間的通訊
父組件的數(shù)據(jù)向子組件通訊是通過props傳遞的
子組件的內(nèi)部數(shù)據(jù)狀態(tài)發(fā)生改變要通知父組件api接口發(fā)送請求刷新數(shù)據(jù)是通過事件來傳遞
引用類型，不能直接改變，要用深拷貝避免影響父組件 42:51

props down events up？

非父子組件間的通訊
全局事件管理，bus
在簡單的場景下，可以使用一個(gè)空的 Vue 實(shí)例作為中央事件總線

單向數(shù)據(jù)流
prop 是單向綁定的：當(dāng)父組件的屬性變化時(shí)，將傳導(dǎo)給子組件，但是不會反過來。這是為了防止子組件無意修改了父組件的狀態(tài)——這會讓應(yīng)用的數(shù)據(jù)流難以理解。
另外，每次父組件更新時(shí)，子組件的所有 prop 都會更新為最新值。這意味著你不應(yīng)該在子組件內(nèi)部改變 prop。如果你這么做了，Vue 會在控制臺給出警告。
為什么我們會有修改 prop 中數(shù)據(jù)的沖動呢？通常是這兩種原因：
prop 作為初始值傳入后，子組件想把它當(dāng)作局部數(shù)據(jù)來用；

prop 作為初始值傳入，由子組件處理成其它數(shù)據(jù)輸出。

對這兩種原因，正確的應(yīng)對方式是：
1.定義一個(gè)局部變量，并用 prop 的值初始化它：
props: ['initialCounter'],
data: function () {
return { counter: this.initialCounter }
}

2.定義一個(gè)計(jì)算屬性，處理 prop 的值并返回。
props: ['size'],
computed: {
normalizedSize: function () {
return this.size.trim().toLowerCase()
}
}

用 Vue.js 添加雙向綁定：
<input v-model="xxx">
上面的代碼基本等價(jià)于
<input :value="xxx" @input="xxx = $event.target.value">
也就是說：
雙向綁定 = 單向綁定 + UI 事件監(jiān)聽

注意在 JavaScript 中對象和數(shù)組是引用類型，指向同一個(gè)內(nèi)存空間，如果 prop 是一個(gè)對象或數(shù)組，在子組件內(nèi)部改變它會影響父組件的狀態(tài)。

Vuex 是一個(gè)專為 Vue.js 應(yīng)用程序開發(fā)的狀態(tài)管理模式。
Vuex 和單純的全局對象有以下兩點(diǎn)不同：
1.Vuex 的狀態(tài)存儲是響應(yīng)式的。當(dāng) Vue 組件從 store 中讀取狀態(tài)的時(shí)候，若 store 中的狀態(tài)發(fā)生變化，那么相應(yīng)的組件也會相應(yīng)地得到高效更新。
2.你不能直接改變 store 中的狀態(tài)。改變 store 中的狀態(tài)的唯一途徑就是顯式地提交(commit) mutations。這樣使得我們可以方便地跟蹤每一個(gè)狀態(tài)的變化，從而讓我們能夠?qū)崿F(xiàn)一些工具幫助我們更好地了解我們的應(yīng)用。

可以通過 store.state 來獲取狀態(tài)對象，以及通過 store.commit 方法觸發(fā)狀態(tài)變更

globalData 就叫做全局?jǐn)?shù)據(jù)源，管理所有的數(shù)據(jù)。
用 Vue.js 添加雙向綁定：
<input v-model="xxx">
實(shí)際上，雙向綁定不是魔法，上面的代碼基本等價(jià)于
<input :value="xxx" @input="xxx = $event.target.value">
也就是說：
雙向綁定 = 單向綁定 + UI 事件監(jiān)聽
單向綁定使得數(shù)據(jù)流也是單向的，對于復(fù)雜應(yīng)用來說這是實(shí)施統(tǒng)一的狀態(tài)管理（如redux）的前提。
雙向綁定在一些需要實(shí)時(shí)反應(yīng)用戶輸入的場合會非常方便（比如多級聯(lián)動菜單）。但通常認(rèn)為復(fù)雜應(yīng)用中這種便利比不上引入狀態(tài)管理帶來的優(yōu)勢。
單向綁定犧牲一部分的便捷性，換來更大的「控制力」。

單向綁定的優(yōu)點(diǎn)是相應(yīng)的可以帶來單向數(shù)據(jù)流，這樣做的好處是所有狀態(tài)變化都可以被記錄、跟蹤，狀態(tài)變化通過手動調(diào)用通知，源頭易追溯，沒有“暗箱操作”。同時(shí)組件數(shù)據(jù)只有唯一的入口和出口，使得程序更直觀更容易理解，有利于應(yīng)用的可維護(hù)性。缺點(diǎn)則是代碼量會相應(yīng)的上升，數(shù)據(jù)的流轉(zhuǎn)過程變長，從而出現(xiàn)很多類似的樣板代碼。同時(shí)由于對應(yīng)用狀態(tài)獨(dú)立管理的嚴(yán)格要求(單一的全局store)，在處理局部狀態(tài)較多的場景時(shí)(如用戶輸入交互較多的“富表單型”應(yīng)用)，會顯得啰嗦及繁瑣。
基本上雙向綁定的優(yōu)缺點(diǎn)就是單向綁定的鏡像了。優(yōu)點(diǎn)是在表單交互較多的場景下，會簡化大量業(yè)務(wù)無關(guān)的代碼。缺點(diǎn)就是由于都是“暗箱操作”，我們無法追蹤局部狀態(tài)的變化(雖然大部分情況下我們并不關(guān)心)，潛在的行為太多也增加了出錯時(shí) debug 的難度。同時(shí)由于組件數(shù)據(jù)變化來源入口變得可能不止一個(gè)，新手玩家很容易將數(shù)據(jù)流轉(zhuǎn)方向弄得紊亂，如果再缺乏一些“管制”手段，最后就很容易因?yàn)橐惶庡e誤操作造成應(yīng)用雪崩。這樣來看，單向綁定跟雙向綁定在功能上基本上是互補(bǔ)的，所以我們可以在合適的場景下使用合適的手段。比如在 UI控件 中(通常是類表單操作)，我會使用雙向的方式綁定數(shù)據(jù)；而其他場景則統(tǒng)一采用 單向 + inline event ( <component msg="msg" on-update="updateMsg(msg)"></component> ) 的方式構(gòu)建應(yīng)用。

單向綁定大概的思路就是：
1.所有的數(shù)據(jù)只有一份
2.一旦數(shù)據(jù)變化，就去更新頁面（data -> 頁面單向綁定）
3.如果用戶在頁面上做了變動，那么就把變動手動收集起來（而不是自動的），合并到先有的數(shù)據(jù)中

Vuex 簡介
Vuex 是適用于 Vue.js 應(yīng)用的狀態(tài)管理庫，為應(yīng)用中的所有組件提供集中式的狀態(tài)存儲與操作，保證了所有狀態(tài)以可預(yù)測的方式進(jìn)行修改。
Vuex 是單向數(shù)據(jù)流的一種實(shí)現(xiàn)。
核心概念
State
State 用來存狀態(tài)。在根實(shí)例中注冊了store 后，用this.$store.state
來訪問。
Getters
Getters 從 state 上派生出來的狀態(tài)。可以理解為基于 State 的計(jì)算屬性。很多時(shí)候，不需要 Getters，直接用 State 即可。
Mutations
Mutations 用來改變狀態(tài)。需要注意的是，Mutations 里的修改狀態(tài)的操作必須是同步的。在根實(shí)例中注冊了 store 后， 可以用this.$store.commit('xxx', data)
來通知 Mutations 來改狀態(tài)。
Actions
Actions 通過調(diào)用 Mutations 來改狀態(tài)。Actions 可以包含異步操作。在根實(shí)例中注冊了 store 后， 可以用this.$store.dispatch('xxx', data)
來存觸發(fā) Action。
Vuex 的完整流程
組件中觸發(fā) Action，Action 提交 Mutations，Mutations 修改 State。 組件根據(jù) State 或 Getters 來渲染頁面。