Vue父子组件通信：将一个对象中的所有属性都作为 props 传递

　　官方文档看到这块有点懵，文档上说    ‘可以使用不带参数的 v-bind（将 v-bind:prop-name 替换为 v-bind）’，那我就想，这样的话，组件中的props属性该写什么值，百度了一下，有了答案。

<div id="example-5">
        <child v-bind="newObject" :other="otherMessage"></child>
</div>

new Vue({
        el:'#example-5',
        data:{
            newObject:{
                name:'zhangsan',
                sex:'man'
            }
        },
        components:{
            'child':{
                props:['name',"sex"],
                template:'<div>{{other}},{{name}}/{{sex}}</div>'
            }
        }
    })；

　　原来是直接用父组件里面对象的属性。同时在传了一个对象的基础上，还可以再传一个属性。

<div id="example-5">
        <!--除了传递对象以外，还可以再传递属性-->
        <child v-bind="newObject" :other="otherMessage"></child>
</div>

new Vue({
        el:'#example-5',
        data:{
            newObject:{
                name:'zhangsan',
                sex:'man'
            },
            otherMessage:'hello everyone'
        },
        components:{
            'child':{
                props:['name',"sex",'other'],
                template:'<div>{{other}},{{name}}/{{sex}}</div>'
            }
        }
})

 　　组件中的data必须是函数

　　可以看出，注册组件时传入的配置和创建Vue实例差不多，但也有不同，其中一个就是data属性必须是一个函数。
这是因为如果像Vue实例那样，传入一个对象，由于JS中对象类型的变量实际上保存的是对象的引用，所以当存在多个这样的组件时，会共享数据，导致一个组件中数据的改变会引起其他组件数据的改变。

　　而使用一个返回对象的函数，每次使用组件都会创建一个新的对象，这样就不会出现共享数据的问题来了。