望着时间滴答滴答的流过,我不曾改变过 . . .

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;
    }
  },
posted @ 2019-09-17 10:32  whyaza  阅读(2092)  评论(0编辑  收藏  举报