組件 之 父級傳子級
阿新 • • 發佈:2019-01-05
for val template scrip component vue pan prop data 父級數據傳遞給子級:
1.通過在子組件的身上加一個v-bind:自定義屬性名=父級的數據
<ppa v-bind:data="arr"> ->簡寫 <ppa :data="arr">
2.子組件通過props去接收
props:[‘data‘]
3.使用
{{data}}
例子:
DOM部份
<div id="app"> <h1>{{arr}}</h1> <hr> <ppa :data="arr"></ppa> </div>script部份
let obj = {
props:[‘data‘],
template:`
<ul>
<li v-for="(val,key) in data">{{val}}</li>
</ul>
`
}
Vue.component(‘ppa‘,obj);
new Vue({
el:‘#app‘,
data:{
arr:[ 1111,2222,3333]
}
});
組件 之 父級傳子級