Javascript 如何在Typescript中定义键回调对的类型

我有一个键回调对的对象

const entitiesUIEvents = {
    newEntityButtonClick: () => {
      history.push("/entity-management/entities/new");
    },
    openEditEntityDialog: (id) => {
      history.push(`/entity-management/entities/${id}/edit`);
    },
    openDeleteEntityDialog: (id) => {
      history.push(`/entity-management/entities/${id}/delete`);
    },
    openDeleteEntitysDialog: () => {
      history.push(`/entity-management/entities/deleteEntitys`);
    },
    openFetchEntitysDialog: () => {
      history.push(`/entity-management/entities/fetch`);
    },
    openUpdateEntitysStatusDialog: () => {
      history.push("/entity-management/entities/updateStatus");
    }
  }

现在在另一个React函数中，我将这些回调传递为

 export function ActionsColumnFormatter(
    cellContent:any,
    row:Entity,
    rowIndex:number,
    { openEditEntityDialog, openDeleteEntityDialog }  // Type Error here
  ) {
    return (
      <>
        <a
          title="Edit entity"
          className="btn btn-icon btn-light btn-hover-primary btn-sm mx-3"
          onClick={() => openEditEntityDialog(row.ipAddress)}
        >
          <span className="svg-icon svg-icon-md svg-icon-primary">
            <SVG
              src={toAbsoluteUrl("/media/svg/icons/Communication/Write.svg")}
            />
          </span>
        </a>
        <> </>
  
        <a
          title="Delete entity"
          className="btn btn-icon btn-light btn-hover-danger btn-sm"
          onClick={() => openDeleteEntityDialog(row.ipAddress)}
        >
          <span className="svg-icon svg-icon-md svg-icon-danger">
            <SVG src={toAbsoluteUrl("/media/svg/icons/General/Trash.svg")} />
          </span>
        </a>
      </>
    );
  }
  

导出函数操作列格式化程序(
内容：任何，
行：实体，
行索引：编号，
{OpenedEntityDialog，openDeleteEntityDialog}//此处键入错误
) {
返回(
OpenedEntityDialog（row.ipAddress）}
>
openDeleteEntityDialog（row.ipAddress）}
>
);
}

---

在上面的代码段中，

openedEntityDialog

和

openDeleteEntityDialog

具有任何类型。但我希望它们是类型安全的。请指导我如何操作。

您对回调使用了解构语法。 为非结构化参数指定显式类型很容易

export function ActionsColumnFormatter(
  cellContent:any,
  row:number,
  rowIndex:number,
  {openDeleteEntityDialog, openEditEntityDialog}: {
      openEditEntityDialog: (id: number) => void,
      openDeleteEntityDialog: () => void,
  }
): JSX.Element {
  // ...
}

我还为ActionsColumnFormatter提供了显式返回类型