Question

我刚刚开始使用打字机,并在与三联S图书馆的Emitter合作时遇到问题。

当我试图发出一个事件时:

const event: THREE.EventDispatcher = new THREE.EventDispatcher();
event.addEventListener( test , () => console.log(1));
event.dispatchEvent({ type:  test  }); // <-- error

https://i.stack.im Gul.com/8wGxC.png” alt=“Image”/。

我犯了一个错误:

www.un.org/Depts/DGACM/index_spanish.htm <代码>{类型:扼杀;}不适用于<代码>从不的参数。

https://i.stack.imgur.com/RQ8pt.png” alt=“Image”/>

但是,如果我这样做的话,它就会发挥作用:

const event: THREE.EventDispatcher = new THREE.EventDispatcher();
event.addEventListener( test , () => console.log(1));
event.dispatchEvent<any>({ type:  test  }); // <-- ignored error by any

但是,在我看来,这是一个坏的解决办法,你可以向我表明如何以解释的方式正确这样做。

Answer 1

The @types/three source code includes unit tests that you can read through for usage examples.

I rewrote

interface TestEvent {
    test: { message: string };
}

const event = new THREE.EventDispatcher<TestEvent>();
event.addEventListener( test , () => console.log(1));
event.dispatchEvent({ type:  test , message: "hello world" });

如果你想作深入解释(警告:我不是像样):

如果您在VSCode/reading the source Code/etc.的类型定义(例如Go to打造型定义>)中研究,这些类型为:

export interface BaseEvent<TEventType extends string = string> {
    readonly type: TEventType;
}

export class EventDispatcher<TEventMap extends {} = {}> {
    // ...

    dispatchEvent<T extends Extract<keyof TEventMap, string>>(event: BaseEvent<T> & TEventMap[T]): void;
}

就是这一例子。

// Sets TEventMap type to { test: { message: string } }
const event = new THREE.EventDispatcher<{ test: { message: string } }>();

// This turns to dispatchEvent<"test"> since the key of TEventMap is extracted
// parameter type is now: event: BaseEvent<"test"> & TEventMap["test"]
// which turns to: { type: "test"; } & { message: string; }
// after intersection (&): { type: "test"; message: string; } 
event.dispatchEvent({ type:  test , message: "hello world" });

友情链接