浅谈v-bind和父子组件传值

v-bind:属性名=“表达式” 可以简写为 :属性名=“表达式” 假如有这样一个例子
：count=“0”,如果不加：，也就是v-bind ，0代表的就是一个字符串，加上v-bind代表的就是表达式，也就是数字0，换一个说法，如果count=“0+1”，加上v-bind就是1，不加就是0+1，（只是个人理解，欢迎指正）
还有就是用v-bind给子组件传数据，那么子组件就要接收一下

<div id="app">
    <son :count="0"></son>
    <son :count="1"></son>
</div>
<script>
    var son ={
        props:['count'],//这就是需要接收的数据
        template:"<div>{{count}}</div>>"
        
    }
    var  vm=new Vue({      //父组件
        el:"#app",
        components:{
         son:son
        }
    })

如果去掉v-bind，将上面的：count=“0”改成

<son count="0+1"></son>
    <son count="1+3"></son>

那么页面显示的就是0+1 和1+3,而不是1和4，大家可以自己试验下
还有父组件传递给子组件的数值，子组件不能去直接修改，应该先复制一个副本，去修改这个副本 ，上代码

var son ={
        props:['count'],//这就是需要接收的数据
        data:function () { //子组件的data必须是函数
         return{
             num:this.count //这就是复制的副本
         }   
        },
        template:"<div @click='handleClick'>{{num}}</div>>",
        methods:{
            handleClick:function () {
                this.num++ // 要实现的是点击数字往上加1 ，不可以写成this.count++，因为不能直接修改
            }
        }

    }