vue组件，父组件与子组件之间通信

技术交流群：365814763

vue组件，组件是一个可复用的功能模块，即将具有相同功能的模块抽取成一个组件，在需要的地方引用即可，这体现了代码封装的思想，下面看一下组件是如何实现：
// 定义一个名为 button-counter 的新组件
Vue.component('button-counter', {
  data: function () {
    return {
      count: 0
    }
  },
  template: 'You clicked me {{ count }} times.'
})

组件是可复用的 Vue 实例，且带有一个名字：在这个例子中是 。我们可以在一个通过 new Vue 创建的 Vue 根实例中，把这个组件作为自定义元素来使用：

 

如果使用webpack或者sublime工具开发时可以通过import组件，对组件的使用以及props组件传值。具体如下：
组件



引用方式通过
import myComponents from '/子组件路径' 引用后即可在使用

  //：father为传递father给子组件

而子组件与父组件之间通信，我们可以调用内建的 $emit 方法并传入事件的名字，来向父级组件触发一个事件，实例：
在子组件中：

在父组件中：

  //targetMehod为在父组件中定义的方法，也可以是一个表达式