削除を確認するモーダルを開く前に削除が発生する

Question

ログを削除するかどうかを確認するダイアログが表示されました。しかし、ログを削除するときに問題が発生しています。私が削除をクリックすると、削除されるかどうかをユーザーに尋ねるモーダルを開くのではなく、ログが削除されます。削除する準備ができている場合、削除ボタンをクリックするとログが削除されます。私の場合は、モーダルを開く前に削除が行われています。私は何を間違えたのですか？

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

Answer 1

最初のコンポーネントでは、onDeleteで(key)を削除します。

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

ちょうどonDelete={this.props.deleteLog}このアクションは、refを送信する代わりに呼び出します。