dcloudio / uni-app

A cross-platform framework using Vue.js
https://uniapp.dcloud.io
Apache License 2.0
40.03k stars 3.63k forks source link

小程序 在 Vue3+vite+ts 项目模板下,没法透传监听事件 #4264

Open JJLau626 opened 1 year ago

JJLau626 commented 1 year ago

问题描述 在二次封装的组件中,通过 v-bind="$attrs" 的方式去透传 props 和 event 监听。但是最后只有 props 能透传,而 event 监听不行。

复现步骤 [复现问题的步骤]

  1. 孙组件
    
    <template>
    <div>
        <div @click="$emit('confirm')">Button</div>
    </div>
    </template>

2. 子组件(这里封装孙组件)
```vue
<template>
    <div>
        <btn v-bind="$attrs"></btn>
    </div>
</template>

<script lang="ts" setup>
import { onMounted, useAttrs } from "vue";
import btn from "./button.vue";
const $attrs = useAttrs()
// 这里打印 $attrs 只有 props ,没有 event 的 key
onMounted(() => {
    console.log('comp mounted', $attrs);
})

</script>
  1. 父组件
    
    <template>
    <view class="content">
    <Comp :value="'123'" @confirm="handleConfirm"></Comp>
    </view>
    </template>


[或者可以直接贴源代码]

**预期结果**
事件监听能透传

**实际结果**
这里只有 value 的 prop ,而没有 confirm。
![image](https://user-images.githubusercontent.com/26458821/230843497-18e15329-a591-438d-a6af-0f44f2df4cef.png)

**系统信息:**
 - 发行平台: 微信小程序
 - 操作系统: win10 操作系统
 - HBuilderX版本:无
 - uni-app版本 [如使用Vue-cli创建/运行项目,则提供`npm run info`的运行结果]
    "@dcloudio/uni-app": "3.0.0-alpha-3070720230316001",
    "@dcloudio/uni-mp-weixin": "3.0.0-alpha-3070720230316001",
    "@dcloudio/uni-automator": "3.0.0-alpha-3070720230316001",
    "@dcloudio/uni-cli-shared": "3.0.0-alpha-3070720230316001",
    "@dcloudio/uni-stacktracey": "3.0.0-alpha-3070720230316001",
    "@dcloudio/vite-plugin-uni": "3.0.0-alpha-3070720230316001",
 - 设备信息 微信开发者工具

**补充信息**
无
sunpm commented 1 month ago

一年了,没下文😰