vue中子组件向父组件传值

1.子组件$emit()触发，父组件$on()监听

子组件：
<template>
  <div class="hello">
    <button v-on:click="onClickMe">telltofather</button>
  </div>
</template>
 
<script>
export default {
  methods: {
    onClickMe () {
      this.$emit('childClick',this.msg);//将this.msg传给父组件
    }
  }
}
</script>

父组件：

<template>
    <div id="app">
    <p>child tell me: {{childWords}}</p>
    <child v-on:childClick='listenToMyBoy'>
    </child>
</div>
</template   >
 
<script>
 
import child from './components/child';
export default {
  components: {
    child
  },
  data () {
    return {
      childWords: ''
    }
  },
  methods: {
    listenToMyBoy (msg) {
      this.childWords = msg;//获取到子组件传过来的值msg
    }
  }
}
</script>