エスケープ・キーで反応ブートストラップ・モードを閉じる

Question

6つのボタンがあり、クリックするとモーダルがアクティブになります。これはReactに書かれています。

//Since I have 6 different modals, giving each of them an id would distinguish them 
onCloseModal(id) { 
    this.setState({ 
     open: false, 
     modalShown: id 
    }) 
} 

render() { 
    return (
     <Modal onHide={this.onCloseModal.bind(this, item.id)} keyboard={true}> 
      <Modal.Header closeButton={true} onHide={this.onCloseModal.bind(this)}> 
      </Modal.Header> 
     </Modal> 
    ) 
} 

私はhttps://react-bootstrap.github.io/components.html#modals-propsのマニュアルに従って、Escキーを押すとモーダルを終了しますkeyboard={true}を、持っています。しかし、それは動作していません。自分のボタンのそれぞれに固有のIDがあるため、すべての設定が完了していると思います。なぜエスケープキーが応答しないのですか？

ここには、動作中のモーダルのイメージがあります。

Answer 1

あなたのコンポーネントの状態が正しくモーダルの状態を表すされていないことが表示されます。 an example（これはベストプラクティスではないかもしれません）と書いてあります。より具体的な方法で状態を処理する方法を示しています。私は十分なコードを提供していませんでしたが、私は実際にあなたが書いたコード（正確にはかなり）やったこと

onCloseModal() { 
    this.setState({ 
    modalShown: 0 
    }) 
} 

onShowModal(id) { 
    this.setState({ 
    modalShown: id 
    }) 
} 

checkModal(id) { 
    if (id == this.state.modalShown) { 
    return true; 
    } else { 
    return false; 
    } 
} 

<Modal show={this.checkModal(item.id)} onHide={this.onCloseModal.bind(this)}</Modal>