==== Vue組件使用細節(jié)點 ====

1、當要使用一個組件但是不能直接使用的時候（比如定義了一個組件row，它的內容是"<tr><td>this</td></tr>"，要在一個table標簽里使用它，直接寫row標簽的話會導致tr和table在同一級），可以使用is屬性使該標簽的內容為組件的內容（如在table內<tr is="row"></tr>，就可以實現(xiàn)table內的每個tr都是自定義組件row的內容），符合h5的編碼規(guī)范

2、在根組件（Vue實例）里定義data的時候，使用對象的形式沒問題；但是在子組件里定義data的時候，data必須是函數(shù)，并且要返回一個對象，對象里包含定義的數(shù)據(jù)：目的是讓每個row的數(shù)據(jù)都獨立存儲

data : function ( ) ?{ ?return { } ? }

3、需要進行DOM操作的時候，可以使用ref定義引用來獲取到相應的DOM元素：

先給標簽定義ref屬性進行引用，給標簽起個名字（如給div標簽起名hell：<div ref="hell">hello world</div>），然后可以通過‘this.$refs.引用名’在函數(shù)里獲取這個DOM元素標簽【this.$refs是當前DOM里所有的引用（父組件里也可以獲取到子組件里的引用），如‘this.$refs.hell’可以獲取到引用名為‘hell’的DOM元素】，然后就可以進行DOM操作。

==== 組件間的數(shù)據(jù)傳遞 ====

---- 父組件向子組件傳值 （屬性） ----

通過屬性的形式 v-bind：

（1）在子組件的標簽里設置屬性【如 v-bind : count="0" 】。給屬性前面加上冒號，參數(shù)‘0’會變成數(shù)字格式（變?yōu)橐粋€js表達式）；不加冒號的話參數(shù)‘0’會是字符串形式。

（2）在子組件里通過props接收數(shù)據(jù)，如props:['count']，然后就可以使用數(shù)據(jù)了【這是單向數(shù)據(jù)流，子組件只能使用父組件傳過來的這個數(shù)據(jù)，而不能去直接修改這個數(shù)據(jù)】

（3）解決單向數(shù)據(jù)流子組件不能直接修改傳過來的數(shù)據(jù)的問題：

在子組件里的data中定義一個變量，把接收到的數(shù)據(jù)復制到這個變量中，變?yōu)樗接械?/b>，然后在子組件的模板里使用定義的這個變量。

---- 子組件向父組件傳值 ----

通過this.$emit ( ) 向上傳遞?：

在子組件觸發(fā)的函數(shù)里使用this.$emit傳遞參數(shù)，如this.$emit('change',2)，第一個參數(shù)是要觸發(fā)的事件（該事件名是自定義的），后面的參數(shù)是要傳遞的數(shù)據(jù)，然后在子組件的標簽里綁定要觸發(fā)的事件，并給事件設置要執(zhí)行的函數(shù)（要執(zhí)行的函數(shù)定義在父組件里）。如@change="handle"。

==== 組件參數(shù)校驗 ====

父組件向子組件傳遞的數(shù)據(jù)，子組件有權對這些數(shù)據(jù)進行約束。

要進行約束的話，props就要是一個對象而不是數(shù)組，對象的鍵就是接收的參數(shù)的名字，對象的值是接收的參數(shù)需要滿足的條件。

---- 更復雜的校驗 ----

type表示數(shù)據(jù)要滿足的類型

required表示父組件是否必須向子組件傳這個值（true/falsle）

default是父組件沒有向子組件傳這個值的時候，默認顯示的內容。

validator是自定義校驗器（名稱是固定的，內容為自定義），value是傳入的數(shù)據(jù)內容，不滿足里面定義的內容就會報錯。

---- props特性與非props特性 ----

==== 組件綁定原生事件 ====

在組件標簽上綁定的事件是自定義事件，在組件模板里綁定的事件才是原生的事件。（自定義事件可以通過在子組件中通過this.$emit去觸發(fā)，但是這樣太麻煩）

給組件標簽上的事件添加‘.native’修飾符（如圖），就可以使事件變?yōu)樵录辉偈亲远x事件。