<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>組件參數校驗與非props特性</title> <script src="./vue.js"></script> </head> <body> <div id="root"> <child content="hell"></child> </div> <script> Vue.component('child',{ props:{ content:{ type:String, // required:false, // default:'default value' validator :function (value) { return (value.length>5) //自定義校驗器 } }, //定義規則 }, template:'<div>{{content}}</div>' }); var vm = new Vue({ el:'#root' }) </script> </body> </html> <!-- Props特性:當父組件使用子組件,經過屬性傳值,子組件中聲明對父組件傳遞過來屬性的接收,一一對應關係,屬性不會顯示在頁面上 非Props特性 子組件沒有聲明props,爲非Props特性 非Props特性 不能在子組件中調用父組件傳過來的數據 顯示子組件最外層的DOM標籤的屬性 -->