组件之间的交互

父组件向子组件传值：
 

1、组件内部通过props接受传递过来的值

        Vue.component('menu-item', {
            props: ['title','content'],
            data() {
                return {
                    msg: '子组件本身的数据'
                }
            },
            template: '<div>{{msg + "-----" + title + "----" + content}}</div>'
        });

2、父组件通过属性将值传递给子组件

        <menu-item title="来自父组件的值"></menu-item>
        <menu-item :title="ptitle" content="hello"></menu-item>

props属性名规则：

• 在props中使用驼峰形式，模板中需要使用短横线的形式
• 字符串形式的模板中吗，没有这个规则

  Vue.component ('menu-item' , {
      //在Javascript中式驼峰式的
      props: ['menu-item'],
      template:'<div>{{ menuTitle }}</div>'
  })
  
  <--在html是短横线的方式-->
  <menu-item menu-title="hello"></menu-item>