ScopedSlotsProxy.vue
<script lang="ts">
import { defineComponent, h } from 'vue';
export default defineComponent({
name: 'ScopedSlotsProxy',
props: ['as', 'scopedSlots'],
setup(props, { attrs, slots }) {
const { as, scopedSlots, ...rest } = props;
return () =>
h(as ?? 'div', {
attrs,
props: rest,
scopedSlots: {
...slots,
...scopedSlots,
},
});
},
});
</script>
Usage: ProxyTable.vue
<template>
<ScopedSlotsProxy
:as="Table"
:scopedSlots="$scopedSlots"
v-bind="$attrs"
/>
</template>
<script lang="ts" setup>
import { Table } from 'ant-design-vue';
// more code
</script>