将传递函数作为 prop

Question

我正在使用 typescript/react，并且我从基于类的组件 A 中获得了这个函数：

    listUpdateFunction() {
        console.log("called update functions")
        this.setState({ shouldUpdate: true });
    }

我将它作为道具传递给另一个组件 B。并将其用于提交按钮。

<button type="submit" onClick={this.props.listUpdateFunction}>Submit!</button>

我的 B 类道具接口是：

interface IProps {
    listUpdateFunction: Function;
}

我打算使用这个函数来调用 A 类中的 componentDidUpdate。但是我的代码没有为 B 类编译它说

<块引用>

(JSX 属性) React.DOMAttributes.onClick?: ((event: React.MouseEvent) => void) |未定义

我不明白，阅读此错误消息时，我认为该函数可能未定义，但我认为该接口会保证它不为空？

Answer 1

尝试更新您的界面

interface IProps {
    listUpdateFunction: (event: React.MouseEvent<HTMLButtonElement>) => void;
}