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

【问题标题】：delete happens before opening a modal with confirmation to delete删除发生在打开确认删除的模式之前
【发布时间】：2017-07-02 15:29:59
【问题描述】：

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

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>
    );
  }
}

【问题讨论】：

标签： javascript reactjs redux

【解决方案1】：

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

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

只需 onDelete={this.props.deleteLog} 你调用这个动作，而不是发送 ref 给它。

【讨论】：