首页 > 代码库 > $emit 子传参给父

$emit 子传参给父

parent.vue

<template>
 <div class="wapper">
<p>child tells me:{{childWord}}</p>
     <child v-on:child-tell-me-something="listenToMyBoy"></child>
</div>
</template>

 <script>
import child from ../components/child
 export default {
  name:wapper,
  components:{child},
  data(){
      return{
          childWord:‘‘
      }
  },
  methods:{
      listenToMyBoy(msg){
       this.childWord=msg
      }
  }
 }
 </script>

child.vue

 <template>
 <div>
    <div @click="up">点我open mouse!

    </div>
   
    </div>
</template>

<script>
  export default{
    data(){
      return {
        msg: hello from components a


      }
    },
 
    methods: {
     up() {
     
       this.$emit(child-tell-me-something,this.msg)
    }
    }
  }
</script>

 

$emit 子传参给父