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
  )
})
相关推荐
Highcharts.js5 分钟前
Highcharts React v4 迁移指南(下):分步代码示例与常见问题解决
javascript·react.js·typescript·react·highcharts·代码示例·v4迁移
Laurence6 分钟前
Qt 前后端通信(QWebChannel Js / C++ 互操作):原理、示例、步骤解说
前端·javascript·c++·后端·交互·qwebchannel·互操作
Pu_Nine_910 分钟前
JavaScript 字符串与数组核心方法详解
前端·javascript·ecmascript
这是个栗子17 分钟前
前端开发中的常用工具函数(六)
javascript·every
码云数智-园园18 分钟前
从输入 URL 到页面展示:一场精密的互联网交响乐
前端
秋水无痕44 分钟前
# 手把手教你从零搭建 AI 对话系统 - React + Spring Boot 实战(一)
前端·后端
高桥凉介发量惊人1 小时前
基础与工程篇-多环境配置(dev/test/prod)与打包策略
前端
墨鱼笔记1 小时前
前端必看:Vite.config.js 最全配置指南 + 实战案例
前端·vite
kyriewen1 小时前
异步编程:从“回调地狱”到“async/await”的救赎之路
前端·javascript·面试
前端Hardy1 小时前
别再手动写 loading 了!封装一个自动防重提交的 Hook
前端·javascript·vue.js