Vue 子组件调用父组件方法[含参数版]
-
子组件
<template>
<div>
<button @click="childEvent(_obj)">点击调父组件方法</button>
</div>
</template>
<script>
export default {
methods: {
// _obj 为参数
childEvent(_obj) {
this.$emit('parent-event', _obj);
}
}
};
</script>
子组件发出
this.$emit('parent-event', _obj);
$emit: 发出
parent-event : 方法
_obj : 参数
-
父组件
<template>
<div>
<child @parent-event="parentEvent"></child>
</div>
</template>
<script>
import child from './child';
export default {
components: {
child
},
methods: {
parentEvent(_obj) {
console.log('我是父类方法' + _obj);
}
}
};
</script>
父组件接收
<child @parent-event="parentEvent"></child>
@parent-event : 接收
作者:IT-IOS-MAN
出处:https://www.cnblogs.com/IT-IOS-MAN/p/16891353.html
版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· Docker 太简单,K8s 太复杂?w7panel 让容器管理更轻松!