我在显示按钮列表时遇到问题，其中每个按钮都会显示一个弹出窗口。我已经采用了 react-modal ( https://github.com/reactjs/react-modal ) 组件并且能够在按钮单击时显示一个弹出窗口，但是我将如何为按钮列表执行此操作？我已经阅读了 refs 集合，但似乎无法通过 refs 名称更改 props 集合访问和组件？
有一个显示按钮：
<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>
我在我正在从事的项目中遇到了完全相同的问题。我已经放弃寻找合适的解决方案，最后想出了https://github.com/fckt/react-layer-stack。主要功能之一 - 它为每个层（可以是 Modal 或其他任何东西）创建了闭包上下文（“use”和“id”属性用于）。
如果您需要帮助，请与我联系。