學習要點：
1.Prop 驗證
本節課我們來開始學習 Vue3.x 的組件中 Prop 類型驗證的方法。
一．Prop 驗證
1. 接著 Prop 類型繼續往下探討，重點研究一下 Prop 類型驗證的問題，如下；
<html-a v-bind:parent-message="100">html-a>
//prop 通信
props : {
parentMessage : Number
},
PS：上面例子是之前的代碼，意味必須傳遞一個數值，否則會提示類型不匹配；
2. 當然，除了限定一個類型之外，還可以設置限定多個類型，比如：
props : {
parentMessage : [Number, String]
},
PS：這樣，傳遞過來的類型數值和字符串均可通過；
3. 如果沒有值傳入的時候，也可以給其設置一個默認值；
props : {
parentMessage : {
type : [Number, String],
default : 100
}
},
PS：默認值也可以通過函數進行返回；
props : {
parentMessage : {
type : [Number, String],
default : function () {
return 200
}
}
},
4. 上面的例子中使用的 type 類型檢查，全部類型檢查如下：
String/Number/Boolean/Array/Object/Date/Function/Symbol
PS：如果你創建了一個對象，要求傳遞的檢查這個對象類型，也是支持的；
5. 使用自定義驗證函數 validator 來處理傳遞過來的數據；
props : {
parentMessage : {
validator(value) {
return ['a', 'b', 'c'].indexOf(value) !== -1
}
}
},
PS：此時，傳遞過來的值必須是 a,b,c 中的一種，否則提示不匹配；
本文由:蘭州啟點網絡（
www.syzhibo.net)整理發布!
啟點CMS演示地址及賬號
