利用React组件中的事件处理程序进行TSX标记

Question

有没有办法让React组件中定义的事件处理程序在类似HTML的标记中可以访问？我的意思是：

<MyComp param1="abc" param2="def" onDoSomething={this.someMethod} />

我的目标是定义ondoSomething，但目前我只知道如何创建诸如param1和param2之类的参数。

export interface MyCompProps {
    param1: string;
    param2: string;
}

export interface DoSomethingEvent {
    someParam: string;
}

export class MyComp extends React.Component<MyCompProps, {}> {
    private doSomethingDispatcher = new EventDispatcher<DoSomethingEvent>();

    public onDoSomething(handler: Handler<DoSomethingEvent>) {
        this.doSomethingDispatcher.register(handler);
    }

    private fireDoSomething(param: string) {
        this.doSomethingDispatcher.fire({someParam: param});
    }
}

如何使事件处理程序ondoSomething通过TSX访问，类似于使用onclick事件？

Answer 1

您可能会遇到问题，因为您当前没有向onDoSomething提供函数，但返回的结果是：

<MyComp param1="abc" param2="def" onDoSomething={this.someMethod()} />

应该是

<MyComp param1="abc" param2="def" onDoSomething={this.someMethod} />