Búsqueda de sitios web

typescript - Cómo tipar el evento on:drop en Svelte para acceder a dataTransfer


Me gustaría escribir correctamente el evento on:drop con Svelte para poder acceder a dataTransfer.

He escrito el evento con el Event nativo, pero datatransfer no está presente.

<div on:drop={handleDrop}> dropzone </div>

<script lang="ts">
  function handleDrop(event: Event) {
    const files = event.dataTransfer.files
  }
</script>

Esto hace que TypeScript lance un error:

La propiedad 'dataTransfer' no existe en el tipo 'Event'.ts(2339)

¿Cómo escribir correctamente este tipo de eventos? Preferiría no hacer ningún tipo de conversión

Respuesta #1

La propiedad dataTransfer está disponible solo en algunos eventos. Al escuchar en drop deberías escuchar para DragEvent.

<div on:drop={handleDrop}> dropzone </div>

<script lang="ts">
  function handleDrop(event: DragEvent) {
    const files = event.dataTransfer.files
  }
</script>