组件传值

组件传递数据
组件传递变量
:is,涉及到属性绑定，后边杭当作一个表达式来解析

<div id="myApp">
        <com1></com1>
    </div>
    <script>
        var myApp = new Vue({
            el:"#myApp",
            data:{ 
                msg:'这是父组件的内容'
            },
            components:{
                com1:{
                    //子组件中，默认无法访问到父组件中data数据和method方法
                    template:'<h3>这是子组件的内容{{msg}}</h3>'
                }
            }
        });
    </script>

//父组件中的数据传递给子组件

<div id="myApp">
        <!-- 父组件可以在引用子组件的时候，通过属性绑定（v-bind）的形式，把需要传递给子组件的数据，以属性绑定的形式，传递到子组件内部，供组件使用，注意，绑定的名称要在子组件内通过pros名称绑定一下 -->
        <com1 v-bind:parentmsg="msg"></com1>
    </div>
    <script>
        var myApp = new Vue({
            el:"#myApp",
            data:{ 
                msg:'这是父组件的内容'
            },
            components:{
                //注意，组件中的所有props数据，都是通过父组件传递给子组件的
                //props中的数据，都是只读的，无法重新赋值
                //把父组件传递过来的parentmsg属性，现在props数组中定义一下，这样，才能使用这个数据
                com1:{
                    template:'<h3>这是子组件的内容--------{{parentmsg}}</h3>',
                    props:['parentmsg'],
                },
            }
        });
    </script>