2
それぞれがポップアップを表示するボタンのリストを表示する際に問題があります。私は反応モーダル（https://github.com/reactjs/react-modal）コンポーネントを取得し、ボタンクリックで単一のポップアップを表示することができましたが、どのようにボタンのリストを作成するのですか？私はrefsコレクションについて読んだことがありますが、refs名でアクセスしているコンポーネントとコンポーネントを変更する方法はないようですね。ReactJSのモーダルを表示するボタンのリストを表示
<button type="button" onClick={this.openModal}>Show</button>
openModal機能：
openModal: function(ref) {
this.setState({isOpened: true});
}
しかし、どのように私は特定のボタンインスタンスの状態値を設定する必要がショーのボタンを持つ
？私はそれぞれのisOpened状態値に特定の名前を付けて作ることができます：isOpened-1、isOpened-2などですが、私はそれが正しい方法ではないと思います。私はちょうどReactJSを学んでいます。
constructor(props){
super(props);
this.state = {
modals: {}
}
}
handleModal(name, event){
let modals = this.state.modals;
if(this.state.modals.some(i => i.name === name)){
let value = this.state.models.filter(f => f.name == name).map(i => i.active)[0];
modals = [...modals, {name: name, open: !value}];
}else{
modals = [...modals, {name: name, open: true}];
}
this.setState({modals: modals})
}
をそして
<button type="button" onClick={this.openModal.bind(this, "modal1")}>Show</button>
どのような場合ですか？異なるボタンのための単一のポップアップを持っていますか、それを別のボディで表示する必要がありますか、いくつかのポップアップがありますか？ – elmeister
@elmeister、大文字小文字の区別は非常に単純です - 各ポップアップは一意の隠しオブジェクト値を持つフォームを持ち、リストから読み込みます（Showボタンが常駐しています）。それはショーの機能ですか、ショー（ID）のようなsomehtin – ArkadyB
いくつかのポップアップを作成する予定がある場合、状態のいくつかの変数は、それぞれのためにオープン状態を提供する必要があります。なぜあなたはこの場合に参照を使用したいのですか？ 'openModal'の' true'に対応するポップアップ変数を渡すのはなぜですか？ – elmeister