前言

　　首先，你需要知道vue中父元件和子元件分別指的是什麼？

　　　　  父元件：vue的根例項——用new Vue()建構函式建立的vue例項（例項會有一個掛載點，掛載點裡的所有內容可理解為父元件的內容）

　　　　　   這裡以root為掛載點，root裡包含的所有內容可稱為模板，即我們常說的父元件

　　　　    子元件：用Vue.component()註冊的元件（下圖todo-item就是元件的名稱，該名稱可自定義，推薦使用短橫線分隔命名）

　　　　    定義元件名的2種方式（截圖截自vue官網）

　　　　    注：建議在html中引用元件時（非字串模板），元件命名都用短橫線命名且字母全小寫的方式

　　父元件向子元件傳遞值

　　　　 父元件：通過屬性的形式進行傳遞（比如v-bind:content="item" ，通過v-bind屬性把item的值動態賦給content變數）

　　　　 子元件：通過props接收父元件傳遞的值 

　　子元件向父元件傳遞值

　　　　子元件：通過$emit()方法釋出事件廣播

　　　　  父元件：捕獲到子元件向外觸發的事件，然後可執行相應的方法

　　　　  下圖為子元件通過$emit()方法向外傳遞delete事件，父元件捕獲到delete事件後執行handleDelete()方法

　　　　  下圖中methods方法裡的this預設指向vue例項

　　　　  不要把methods方法寫成箭頭函式，因為箭頭函式會改變this的指向，使this不在預設指向vue例項，而指向undefined

　　　　  同時vue例項中的data，computed，watch屬性也都不要寫成箭頭函式，理由同上

　　　　　注：@delete="handleDelete"為v-on:click="handleDelete"的簡寫；

　　　　　　 :content="item"為v-bind:content="item"的簡寫

　　補充：怎麼註冊全域性元件和區域性元件

　　　　  ①：註冊全域性元件（用Vue.component()，元件名為todo-item，可自定義，推薦使用短橫線分隔命名）

　　　　　    ②：註冊區域性元件（通過一個 JavaScript 物件來定義元件）

　　　　　   註冊區域性元件後，直接引用元件<todo-item></todo-item>會報錯，提示未註冊該元件

　　　　　   解決方法是在vue例項中用components進行宣告

 　　　　　  注：對於components物件中的每個屬性來說，其屬性名就是自定義元素的名字，其屬性值就是這個元件的選項