2021-09-07 父子组件传值--子传父

最新推荐文章于 2024-11-15 13:54:42 发布

一个不想佛系的橘子

最新推荐文章于 2024-11-15 13:54:42 发布

阅读量128

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/m0_55428057/article/details/120163440

版权

子传父：$emit

子组件部分：

<div class="child" @click="sendMsg()"> 
<!-- 此处设置点击事件，点击后即可执行相应传值事件 -->
    子组件
</div>

<script>
    export default {
        methods:{
            sendMsg(){
                this.$emit('子自定义方法名'，所传值)  
                //关键语句 自定义方法名随意，对应父组件就可以
            }
        }
    }
</script>

父组件部分

<div class="parent">
    <Child @'子自定义方法名'="父方法"/>  
    <!-- 子组件  @ = v-on:  -->
</div>

<script>
    import Child from '路径';
    export default{
        data(){
            属性x:x值, 
        }，
        components:{
            Child，
        }，
        methods:{
            父方法(){
                this.属性x=值x
            }
        }
    }
</script>