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>