父組件向子組件傳遞數據,注意組件之間的作用域是獨立的,所以要如果父組件要向子組件傳遞數據,首先要在父組件中寫成屬性的形式,屬性名就是傳遞的名字,屬性值就是傳遞給子組件的值,由于HTML 特性不區分大小寫,所以屬性值需要寫成 kebab-case(短橫線隔開),子組件中props寫成 camelCase(駝峰).如下:
子組件
props:['myMessage'], template:'<span>{{ myMessage }}</span>'})父組件
<div my-massage='hello'></div>
動態props,將父組件傳遞的值前面加上v-bind或者‘:’寫成 <div v-bind:my-massage='定義的變量'>
,如果想傳遞一個數字1給子組件,需要寫成<div v-bind:my-massage='1'>
,如果不是用v-bind,則會傳遞一個字符串1給子組件,prop是一個單項的數據流,改變子組件的prop不會導致父組件傳遞的prop改變,除非父組件傳的是一個數組或者對象。
props詳細教程
新聞熱點
疑難解答