对于完整键入，请将事件引发器更改为：

const dispatch = createEventDispatcher<{submit:{username:string, password:string}}>()

和事件使用者执行以下操作：

const loginHandle = function (a: CustomEvent<{username:string, password:string}>) {
    console.log(a.detail.username) //username is type string
    console.log(a.detail.password) //password is type string
}

这将使dispatch（“submit”，“wrongDetailType”）失败，并且它消除了处理程序中类型为“any”的a.detail。

如何或在何处可以找到自定义组件事件的类型：
可以将对象传递给createEventDispatcher函数的泛型。其中key是自定义事件名称，value是详细信息对象。
子组件（<Calendar />）

<script lang="ts">
  import { createEventDispatcher } from 'svelte'

  const dispatch = createEventDispatcher<{ select: Date }>()

  function onSelect(date: Date): void {
    dispatch('select', date)
  }
</script>

...

父组件

<script>
  function handleSelect (event: CustomEvent<Date>) {
    console.log('Selected date', event.detail)
  }
</script>

<Calendar on:select={handleSelect} />

用法示例

Svelte现在附带了一个CustomEvent接口定义，所以你可以如下声明你的函数。

const loginHandle = function (a: CustomEvent) {
    console.log(a)
}

我发现这是不可能的使用Svelte事件系统。您可以声明类型的每一方，但目前没有什么可以验证的类型（或事件的事件名称）在组件中匹配的代码使用该组件。
然而，这可以通过使用回调属性而不是事件来解决。我所知道的唯一缺点是，onSubmit名称作为回调/事件不如on:submit明显，并且您需要声明要传播的事件。总的来说，这似乎是对事件名称和事件值进行类型检查的一个非常小的代价。您还可以进行所需的回调，这对于在不侦听特定事件的情况下使用没有意义的组件非常有用。

示例

这是原始问题中代码的最小化示例。

组件

<script context="module" lang="ts">
    export interface Payload {
        username: string,
        password: string,
    }
</script>
<script lang="ts">
    export let onSubmit: (payload: Payload) => void;

    function handleSubmit(e: SubmitEvent) {
        e.preventDefault()
        onSubmit({
            username: e.target.username.value,
            password: e.target.password.value,
        });
    }
</script>

<form on:submit={handleSubmit}>
    <input name=username required>
    <input type=password name=password required>
    <button type=disabled>Login</button>
</form>

注意：要使处理程序可选，只需将noop函数设置为默认值：

export let onSubmit: (payload: Payload) => void = () => {};

来电者

<script lang="ts">
    import Login from "./Login.svelte"
    import type {SubmitEvent} from "./Login.svelte"
    function handleLogin (event: SubmitEvent) {
        console.log(event)
    }
</script>

<main>
    <Login onSubmit={handleLogin}/>
</main>