vue子组件向父组件通讯

<div class="app">
     <p>父组件接收：{{total}}</p>
     <button-counter v-on:incrementchind="Total"></button-counter>
  </div>

//子组件的数据
Vue.component('button-counter', {
  template: '<button v-on:click="increment">{{ counter }}</button>',
  data: function () {
    return {
      counter: '子组件按钮点击传值'
    }
  },
  methods: {
    increment: function () {//子组件的button绑定的事件increment
      this.$emit('incrementchind','我是子组件过来的数据');//使用$emit方法执行父组件的v-on:incrementchind方法 并且传参
    }
  },
})
//父组件的数据
new Vue({
  el: '.app',
  data: {
    total: ''
  },
  methods: {
    Total: function (val) {//从子组件接收的数据val
      this.total=val;
    }
  }
})