概念：
1、父级 prop 的更新会向下流动到子组件中，但是反过来则不行。这样会防止从子组件意外改变父级组件的状态。
2、每次父级组件发生更新时，子组件中所有的 prop 都将会刷新为最新的值。这意味着你不应该在一个子组件内部改变 prop
试图改变prop的两种情况：
1、 这个 prop 用来传递一个初始值；这个子组件接下来希望将其作为一个本地的 prop 数据来使用。在这种情况下，最好定义一个本地的 data 属性并将这个 prop 用作其初始值：
<body>
<div id="app">
<!-- a、父组件通过属性绑定的方式传值 -->
<counter :count="0"></counter>
<counter :count="1"></counter>
</div>
<script>
var counter={
//b、子组件接收父组件的传值
props:['count'],
//c、把父组件传来的值放入模板中渲染
template:"<div @click='handleClick'>{{number}}</div>",
data:function(){
return{
//复制一份，子组件就可以修改了
number:this.count
}
},
methods:{
handleClick:function(){
//不能直接这么写，因为子组件不能修改父组件的传值
// this.count++
this.number++
}
}
}
var app = new Vue({
el:'#app',
//注册局部组件
components:{
counter:counter
}
})
</script>
</body>
2、 这个 prop 以一种原始的值传入且需要进行转换。在这种情况下，最好使用这个 prop 的值来定义一个计算属性：(见官网)
props: ['size'],
computed: {
normalizedSize: function () {
return this.size.trim().toLowerCase()
}
}
