Vue组件传值

<template>
<div>

</div>
</template>

<script>
export default {}
</script>

<style>
</style>

<template>
<v-hearder><v-hearder>
</template>

<script>
import hearder from './components/hearder/hearder'

export default {
components:{
"v-hearder":hearder
}
}

</script>

// 使用http网络请求 则需要使用vue-resource组件
// 先在package.json中的dependencies里面增加 "vue-resource":"^1.3.4"（这是最新版本）【node服务下】
// main.js文件中需要增加：import VueResource from 'vue-resource' 与 Vue.use(VueResource)
// 然后在node命令框中执行：npm install与npm run dev两个命令，项目中就引用了vue-resource组件
// 若是本地简单使用则只需要导入vue-resource.js文件库就可以了

export default {
data(){
return {
seller:{}  // 接收的获取数据属性名
}
},
created(){
this.$http({method:"GET",url:"/api/seller"}).then(function(res){
this.seller=res.data; // 接收数据并设置值
},function(error){})
}
}

<!-- 其实是使用 vue中的props进行组件参数的传递 -->
<!-- 参数必须赢v-bind指令进行绑定操作，不然子组件接收不到父组件传值 -->
<!-- 若想详细了解props使用，请访问vue社区阅读其API说明 -->

<v-hearder v-bind:seller="seller"></v-hearder>

<template>
<div>
<img :src="seller.avatar">
</div>
</template>

<script>
// props 支持的参数类型有：Number、Boolean、String、Object、Function、Array、Symbol
export default {
props:{
seller:{
type:Object
}
}
}
</script>