【Vue】组件通信（子传父 $emit）

微信订阅号：Rabbit_svip

组件和组件之间是相互独立的。
如果父组件需要传值给子组件，可以看这里 【Vue】组件通信（父传子 props）

---

本节主要讲解 子组件 传值给 父组件。

主要用到的关键词是：$emit

HTML代码

JS代码

Vue.component('parent', {
    template: `
        

            
            
 name: {{ name }} 
            
 age: {{ age }}
        
    `,
    data() {
        return {
            name: '',
            age: ''
        }
    },
    methods: {
        show(data) {
            this.name = data.name;
            this.age = data.age;
        }
    }
});

Vue.component('child', {
    template: `        btn
    `,
    methods: {
        on_click() {
            this.$emit('show-txt', {name: 'Rabbit', age: 18})
        }
    }
});

new Vue({
    el: '#app'
})

微信订阅号：Rabbit_svip

---

微信订阅号：Rabbit_svip