子组件要想获得父组件的值,需要在父组件自定义属于并在子组件中调用props 进行调用,举个例子
<div id="fruit">
<fruit-list :list="list"> </fruit-list>
</div>
Vue.component('fruit-list',{
data:function(){
return {}
},
props:['list'],
template:`<ol>
<li v-for="item in list" :key="item.id">
{{item.name}}
</li>
</ol>`
})
var vm = new Vue({
el:'#fruit',
data:{
list:[{
id:1,
name:'apple'
},
{
id:2,
name:'orange'
},{
id:3,
name:'banner'
}]
}
})
这样就能对父组件中的list进行遍历,注意当父组件 以 字母——字母 形式出行时,props需要使用驼峰形式.