Vue3 父事件覆盖子事件,Vue2 的 v-on=“$listeners“ 的替代方案

在 Vue3 中,$listeners 被删除

子组件代码,需要特别注意的是事件名为 on 开头,例如 onBack。不确定的可以通过给父组件传递 事件或属性,再打印子组件的 attrs = useAttrs(),来确定传值

javascript 复制代码
// template
v-bind="newAttrs"
// template

import { computed, useAttrs } from 'vue'
const attrs = useAttrs()
const newAttrs = computed(() => {
  return Object.assign(
    {
      onBack: () => { // !! onBack 而不是 Back
        goBack()
      }
    },
    attrs
  )
})
相关推荐
酒尘&19 分钟前
Hook学习-上篇
前端·学习·react.js·前端框架·react
houyhea38 分钟前
从香港竹脚手架到前端脚手架:那些"借来"的发展智慧与安全警示
前端
哈哈~haha1 小时前
Step 14: Custom CSS and Theme Colors 自定义CSS类
前端·css·ui5
Ndmzi1 小时前
Matlab编程技巧:自定义Simulink菜单(理解补充)
前端·javascript·python
勇气要爆发1 小时前
物种起源—JavaScript原型链详解
开发语言·javascript·原型模式
我命由我123451 小时前
VSCode - VSCode 修改文件树缩进
前端·ide·vscode·前端框架·编辑器·html·js
SoaringHeart2 小时前
Flutter组件封装:验证码倒计时按钮 TimerButton
前端·flutter
San30.2 小时前
深入理解 JavaScript OOP:从一个「就地编辑组件」看清封装、状态与原型链
开发语言·前端·javascript·ecmascript
AAA阿giao2 小时前
JavaScript 原型与原型链:从零到精通的深度解析
前端·javascript·原型·原型模式·prototype·原型链
0***86333 小时前
SQL Server2019安装步骤+使用+解决部分报错+卸载(超详细 附下载链接)
javascript·数据库·ui