当前位置: 首页 > news >正文

vue子组件关闭自己的方式(事件触发)

  • 背景:学习vue。在做项目图中使用cursor编写过程发现好的方式进行记录学习。
  • 子组件内部方法处理完逻辑后调用了handleClose方法,意图关闭自己,update:show:将自身props中的属性show更新为falseemit('close')触发了父页面的close事件,执行了handleFellowClose在关闭子页面的同时也同步更新了父页面的属性。
<u-popup v-model="show" mode="center" :border-radius="16" width="600rpx">
...
// 子页面
props: {show: {type: Boolean,default: false},
...
handleClose() {this.$emit('update:show', false);this.$emit('close');
}
// 父页面
<FellowSelector:show="showFellowSelector":fellowList="fellowList"@confirm="handleFellowConfirm"@close="handleFellowClose" />
...
http://www.lryc.cn/news/600520.html

相关文章:

  • React入门学习——指北指南(第三节)
  • Netty中DefaultChannelPipeline源码解读
  • 「iOS」——内存五大分区
  • 【C语言】深入理解C语言中的函数栈帧:从底层揭秘函数调用机制
  • RabbitMQ--消息丢失问题及解决
  • 【Vue2】结合chrome与element-ui的网页端条码打印
  • GRE和MGRE综合实验
  • 深入解析三大Web安全威胁:文件上传漏洞、SQL注入漏洞与WebShell
  • 字节跳动扣子 Coze 宣布开源:采用 Apache 2.0 许可证,支持商用
  • 2025.7.26字节掀桌子了,把coze开源了!!!
  • 服务器被网络攻击后该如何进行处理?
  • 守护汽车“空中升级“:基于HSM/KMS的安全OTA固件签名与验证方案
  • 解决使用vscode连接服务器出现“正在下载 VS Code 服务器...”
  • [硬件电路-91]:模拟器件 - 半导体与常规导体不一样,其电阻式动态变化的,浅谈静态电阻与动态电阻
  • C++高效实现AI人工智能实例
  • 2025年7月26日训练日志
  • Arthas的使用
  • ultralytics yolov8:一种最先进的目标检测模型
  • 第十三篇:Token 与嵌入空间:AI如何“阅读”人类的语言?
  • Qt 线程同步机制:互斥锁、信号量等
  • 【电赛学习笔记】MaxiCAM 的OCR图片文字识别
  • 数据库HB OB mysql ck startrocks, ES存储特点,以及应用场景
  • Django5.1(130)—— 表单 API一(API参考)
  • JavaScript里的reduce
  • Android开发中协程工作原理解析
  • # JsSIP 从入门到实战:构建你的第一个 Web 电话
  • 数据结构 双向链表
  • Spring Boot集成RabbitMQ终极指南:从配置到高级消息处理
  • Vue 插槽
  • Claude Code PowerShell 安装 MCPs 方法:以 Puppeteer 为例