Question

我有一个状态更新功能，单击该功能可以呈现模态。这是函数：

  openDeleteUserModal = ({ row }: { row: IUser | null }): any => (
    event: React.SyntheticEvent
  ): void => {
    if (event) event.preventDefault();
    this.setState({ userToDelete: row, isDeleteUserModalOpen: true });
  };

问题在于，单击元素是带有href的标签。


export const userDeleteRenderer = (options: any): any => (
  cell: string,
  row: string
): JSX.Element => {
  const deleteUserClick = options.onClick({ cell, row });
  return (
    <div className="float-right" data-test="delete-icon">
      <a href="#" className="text-danger p-1 text-lg" onClick={deleteUserClick}>
        <Icon icon="trash" />
      </a>
    </div>
  );
};

因此，如果我删除了prevent default并执行了类似的操作，则会立即调用模式。已调试，无法找到原因。

您能帮我从上面删除阻止默认设置吗？这使我的测试生活非常困难。如果我删除它，它会更干净。谢谢！

Answer 1

您可以使用类似这样的内容：

<a href="javascript:void(0)" className="text-danger p-1 text-lg" onClick={deleteUserClick}>
  <Icon icon="trash" />
</a>

但是，如果只需要游标，则可以使用CSS来实现，如下所示：

<div onClick={deleteUserClick} style={{cursor: "pointer"}}>
  <Icon icon="trash" />
</div>

反应|如何从状态更新中删除prevent.default

1 个答案: