he-tree
he-tree copied to clipboard
Typescript error when trying to override Draggable default slot
I have the following snippets of code to override the Draggable default slot:
<template>
<!-- ... -->
<Draggable ...>
<template v-slot="{ node, tree }">
<!-- ... -->
</template>
</Draggable>
</template>
<script setup lang="ts">
import { Draggable } from "@he-tree/vue3";
// ...
</script>
However, on the line of the <template v-slot>, I get the following typescript error:
ts(7053): Element implicitly has an 'any' type because expression of type '"default"' can't be used to index type '{} | {}'.
Property 'default' does not exist on type '{} | {}'.
~~The types come from node_modules/@he-tree/vue3/types/draggable/Draggable.vue.d.ts but it doesn't seem to contain slot definitions, hence the error.~~ Just tried generating .d.ts declarations for a Vue component with slots but it appears the slots aren't in the type definition at all? How is this supposed to work at all when including Vue SFC components from npm packages?
Found a workaround: instead of <Draggable ...> use <component :is="Draggable" ...> and Typescript checking of slots seems to be disabled, so at least the error is gone. Still wondering how this should be resolved.
it seems a ts config error, try "esModuleInterop": true