父组件向子组件传值

父组件向子组件中传值

组件嵌套，是很常见的，这就涉及到值的传递问题，再组件之间值是不可以直接传递的，需要借助属性绑定，即v-bind:自定义属性名="data中的数据"，然后，在子组件中通过props属性引用这个自定义的属性名，通过这种方式，才可以进行数据的传递。

例：

<div id="app">
        <mycom :parentmsg='msg'></mycom>
    </div>

    <template id="tmp1">
        <div>
            <h1>hello world</h1>
            <h5>{{ parentmsg }}</h5>
        </div>
    </template>
    <script>

        var vm = new Vue({
            el: '#app',
            data: {
                msg: 'make the world a better place'
            },
            methods: {},
            components: {
                mycom: {
                    template: '#tmp1',
                    props: ['parentmsg']
                }
            }
        });
    </script>

注意： props中的属性是只读的不能够通过子组件修改，另外，自定义的属性名最好全部小写，否则会报错