组件属性设置

组件属性(props)的设置有两个坑，第一个坑是组件属性命名一定不能有-只能化成驼峰式，第二个坑是props是数组，不能写成对象形式而且他是写在template底下的；

组件属性设置有两种，一种是直接属性，一种是绑定data

直接设置属性

<body>
    <div id="app">
        <panda here="China"></panda>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            components:{
                'panda':{
                    template:`<h2>我来自{{here}}</h2>`,
                    props:['here']
                }
            },
         })
    </script>
</body>

绑定data

<body>
    <div id="app">
        <panda :here="message"></panda>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data:{
                message:'China'
            },
            components:{
                'panda':{
                    template:`<h2>我来自{{here}}</h2>`,
                    props:['here']
                }
             },
         })
    </script>
</body>