【Uniapp-Vue3】组件中emit的声明触发事件

emit能够实现子组件向父组件传递数据。

一、子组件写法

<标签名 @触发事件="$emit('父组件触发事件名', 传递的数据)"></标签名>..

这个子组件的名字为user-layout,我们点击按钮向父元素传递一个随机数:

二、父组件的写法

<子组件名 @父组件触发事件名="函数"></子组件名>

函数中使用函数参数的方式接收传过来的数据。

三、多个事件传值

1.子组件写法

let emit = defineEmits(['父组件触发事件1', '父组件触发事件2']);

emit('父组件触发事件', 传递数据);

2.父组件写法

<子组件名 @父组件触发事件1="函数1" @父组件触发事件2="函数2"></子组件名>

同样函数使用参数来接收从子组件传递过来的数据。

相关推荐
lryh_3 分钟前
react 中使用ant 的 Table时警告:没有设置key
前端·react.js·前端框架
子燕若水5 分钟前
Unreal Engine 5 (UE5) Metahuman 的头部材质
前端·ue5·材质
互联网-小阿宇1 小时前
【HTML+CSS+JS+VUE】web前端教程-31-css3新特性
前端·javascript·css
林涧泣1 小时前
【Uniapp-Vue3】@import导入css样式及scss变量用法与static目录
css·uni-app·scss
oil欧哟2 小时前
uniapp 小程序 textarea 层级穿透,聚焦光标位置错误怎么办?
vue.js·小程序·uni-app·uniapp
han_2 小时前
为实现前端截图功能,我的dom-to-image踩坑之旅!
前端·javascript
不修×蝙蝠2 小时前
vue(七) vue进阶
前端·javascript·vue.js·前端框架·vue·ssm·进阶
ihengshuai2 小时前
Gitlab Runner安装与配置
前端·docker·云原生·gitlab·devops
甄同学2 小时前
【WPS】【WORD&WORD】【JavaScript】实现微软WORD自动更正的效果
开发语言·前端·javascript
passerby60612 小时前
实现一个响应式的本地存储localStorage
前端