子组件给父组件的传值

子组件：

<template>
    <div class="app">
       <input @click="sendMsg" type="button" value="给父组件传递值">
    </div>
</template>
<script>
export default {
 
    data () {
        return {
//将msg传递给父组件
            msg: "我是子组件的msg",
        }
    },
methods:{
sendMsg(){
//func: 是父组件指定的传数据绑定的函数，this.msg:子组件给父组件传递的数据
this.$emit('func',this.msg)
}
}
}
</script>

子组件通过this.$emit()的方式将值传递给父组件

注意：这里的func是父组件中绑定的函数名

父组件：

<template>
<div class="app">
　　<child @func="getMsgFormSon"></child>
</div>
</template>
<script>
import child from './child.vue'
export default {
　　data () {
　　　　return {
　　　　　　msgFormSon: "this is msg"
　　　　}
　　},
　　components:{
　　　　child,
　　},
　　methods:{
　　　　getMsgFormSon(data){
　　　　　　this.msgFormSon = data
　　　　　　console.log(this.msgFormSon)
　　　　}
　　}
}
</script>

好了，so easy!
————————————————
版权声明：本文为CSDN博主「sdj_beyond」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/weixin_38888773/article/details/81902789