上面的例子我们的组件里面data的属性是固定的，那么我有什么办法可以修改firstname 和 secondname的值呢？组件一般不能写的太死，组件的内容一般需要外边传
    所以我们需要定义一些属性
    也就是说我在使用组件的时候怎么传递变量给组件，并被组件接收呢？
    1.组件中设置props用来接受外部变量
    2.使用组件的时候，传入变量

    1. <!DOCTYPE html>
    2. <html>
    3.     <head>
    4.         <meta charset="utf-8">
    5.         <title></title>
    6.     </head>
    8.     <body>
    9.         <script type="text/javascript" src="https://unpkg.com/vue/dist/vue.js"></script>
    11.         <div id="app">
    13.         </div>
    15.         <script>
    16.             //1.创建一个组件
    17.             var MyCompose = {
    18.                 props:["firstname","secondname"],
    19.                 data() {
    20.                     return{
    21.                         title : "hello",
    22.                     }
    23.                 },
    24.                 //method和computed都可以保留
    25.                 methods: {
    26.                     fullname() {
    27.                         return this.firstname + this.secondname
    28.                     }
    29.                 },
    30.                 template: `
    31.                     <h3> {{ firstname }}  {{ secondname }}  {{ fullname() }} </h3>
    32.                 `,
    33.             };
    35.             //2.全局注册组件，注意最好使用驼峰写法
    36.             // Vue.component("MyComp",MyCompose);
    38.             //3.使用组件
    39.             var vm = new Vue({
    40.                 el:"#app",
    41.                 //4.局部注册组件
    42.                 components: {
    43.                     MyCompose,
    44.                 },
    45.                 template:`
    46.                     <MyCompose firstname="a" secondname="b" ></MyCompose>
    47.                 `,
    48.             })
    49.         </script>
    51.     </body>
    52. </html>