vue的一个核心概念就是组件，而组件实例的作用域是孤立的，所以组件之间是不能直接引用其他组件的数据的。极端点举例来说，就是可以在同一个项目中，每一个组件内都可以定义相同名称的数据。
data () {
return {
msg: "Hello Vue2.0.js"
}
}
比如每个组件我们都定义一个msg，当我们使用msg的时候，使用的都是各自组件内部的msg，而不会互相干扰。
而如果父子组件当中，如果需要实现数据的传递，父组件的数据需要通过 prop 才能下发到子组件中，子组件要显式地用props选项声明它预期的数据。
<photo-item
v-for="(item, index) in rightLists.item"
:key="item.id"
:item="item"
@del="del">
</photo-item>
以<photo-item />子组件为例，在父组件当中调用<photo-item /> 通过prop显示传递item，也就是“:item='item'”，在子组件当中，显示声明props
props: ["item"]
就可以获取到父组件传递过来的item对象，同时prop可以提供指定验证规则。如果传入的数据不符合要求，Vue 会发出警告。
props: {
'item':{
type: Object,
required: true
}
},
使item成为一个对象，type指定传递过来的item数据类型，可以以数组方式指定多种数据类型，required指定是否为必传，default指定默认值，validator是自定义一个验证函数。
如果你想把一个对象的所有属性作为 prop 进行传递，可以使用不带任何参数的 v-bind。
<template>
<child-comp v-bind="item"></child-comp>
</template>
import ChildComp from "./components/ChildComp.vue"
export default{
data () {
return {
item: {
text: "欢迎使用vue",
version:"2.0"
}
}
},
components:{
ChildComp
},
}
此时在子组件当中，使用props显示接收的就是text和version，而与名义上的item已经没有什么关系了。
export default{
props: ["text", "version"]
}
在子组件当中如果需要改变父组件传递过来的数据，并且传递会去，则需要使用到vue 的自定义事件系统。
在子组件当中绑定事件，通过$emit通知父组件。
子组件的实现过程：
<template>
<div @click="changeText">
{{hello}}
<hr>
{{version}}
</div>
</template>
<script>
export default{
data(){
return{
hello: this.text
}
},
props: ["text", "version"],
methods:{
changeText(){
this.hello = "我需要改变传递过来的text，并且通知父组件当中的数据";
this.$emit("changedComppText")
}
}
}
</script>
通过事件changeText，实现子组件的事件变化，在函数changeText内部通过 this.$emit("changedComppText") 向父组件报告自己的内部事件，在父组件当中，通过自定义事件
<child-comp v-bind="item" @changedComppText = "beChanged"></child-comp>
然后在methods中定义方法beChanged，从而实现父组件当中的数据变化，来同步实现子组件的数据变化。其中$emit还有第二个payload参数通知变化结果。