vue中父组件向子组件传值，子组件向父组件传值，简洁易懂

Vue 中父组件传值到子组件

Vue 中父组件传值分为两步：
一、父组件中代码中，使用属性绑定向子组件传递数据，
如图, 其中，:titles=”title” 就是在将父组件的 title 属性值，传递到子组件所绑定的 titles 属性中，这时候，子组件就有了一个带有值的 titles 属性了

二、子组件需要接收传过来的属性值
如下代码，子组件需要使用 props 属性去接受刚刚父组件传递过来的属性 titles 和 contents，需要定义一下属性类型哦

总结一下：

父组件中引入子组件、注册子组件，tempalte 中使用子组件；import、components、
子组件：props 中创建一个属性，接受父组件传的值；
在 template 中使用 {{contents}}；
父组件中的，：title 与子组件中 prop 添加的属性名称要一致；
=”title“与父组件中 data 数据中的 title 名称要一致；

props 绑定的写法也可以写成这样的形式

 props: {
    title: {type: String,  // [String, Number],
      default: 1
    }
  }

Vue 中子组件传值到父组件

子组件传值到父组件也有两步。
一：子组件通过 $emit 触发一个自定义事件，传递属性出去
如下，通过按钮（也可以其它方式，能触发 $emit 即可），触发 $emit 方法，传递 datas 的值出去

>
>

2. 在父组件中引用子组件的标签中，使用 v -on 监听该自定义事件并添加一个响应该事件的处理方法

>

总结：
子组件通过 $emit 传递参数出去，在父组件中引用子组件的标签中，使用 v -on 监听该自定义事件并添加一个响应该事件的处理方法