开发者问题收集

删除发生在打开确认删除的模式之前

2017-07-02
71

我制作了一个对话框,要求确认是否删除日志。但我在删除日志时遇到了问题。当我单击删除时,日志被删除,而不是打开一个模式,询问用户是否确定删除。如果他们准备删除,他们将单击删除按钮,然后日志应该被删除。在我的情况下,删除发生在打开模式之前。我做错了什么?

handleDelete(key) {
  this.setState({ show: true });
  const logDeleteConfirmation = (
    <DeleteConfirmation
      hideDialog={this.props.hideDialog}
      logKey={key}
      onDelete={this.props.deleteLog(key)}
    />
  );
  this.props.showDialog(logDeleteConfirmation);
}


render() {
  return(
  <div className="col-md-6 text-right">
    <a
      className="text-danger"
      onClick={() => this.handleDelete(log.get("_id"))}
    >
      Delete
    </a>
  </div>
  )
}


class DeleteConfirmation extends React.PureComponent {
  handleDelete(key) {
    console.log("key", key);
    this.props.onDelete(key);
    this.props.hideDialog();
  }

  render() {
    return (
      <Modal show onHide={() => this.props.hideDialog()} className="md-box">
        <h1>Are you sure want to delete?</h1>
          <button
            onClick={() => this.handleDelete(this.props.logKey)}
          >
            Delete
          </button>
      </Modal>
    );
  }
}
1个回答

在第一个组件的 onDelete 中删除 (key)

 <DeleteConfirmation
      hideDialog={this.props.hideDialog}
      logKey={key}
      onDelete={this.props.deleteLog(key)} //here
    />

只需 onDelete={this.props.deleteLog 即可调用此操作,而不是向其发送 ref。

Andrii Starusiev
2017-07-02