vue $emit $on 从子组件传递数据给父组件

原理是: 子组件使用$emit发送数据，父组件使用$on,或者v-on绑定， 来监听子组件发送的数据。

子组件:

<button @click="sendChildData">点击我将子组件的数据传递给父组件</button>
data () {
    return {
        childData: 111
    }
  },
  methods:{
      sendChildData(){
          this.$emit('sendtoFu',this.childData);
      }
  }

父组件:

<子组件 @sendtoFu="getChildData"></子组件>
<div>这是子组件传递过来的数据 --->   {{  isMe }} </div>
data() {
    return {
      isMe : ''
    }
  },
  methods:{
    getChildData(data){
      this.isMe = data;
    }
  },

转载于:https://www.cnblogs.com/whyaza/p/11531950.html