javascript - 在 .map onClick() 中渲染组件 - React

Question

我正在尝试呈现组件 onClick，我遇到的问题是我的 onClick 在每一行中打开组件，而不仅仅是在我单击的按钮中。这可能是任何索引问题。你能看看我的代码吗？谢谢!

 class ItemView extends Component {
  constructor(props) {
    super(props);

    this.state = {
      isFormOpen: false,
      parentId: null,
    }
  }

  handleAddItem = (value) => {
    this.setState({
      parentId: value.parentId,
      isFormOpen: !this.state.isFormOpen,
    })
  }

  render() {
    return (
      <div className="ui relaxed divided list">
        {data.items.map((item, index) => {
          return (
            <div className="item" key={index}>
              <Button
                label={'Add Item'}
                onClick={() => this.handleAddItem({ parentId: item.parentId })}
              />
              {isFormOpen && (
                <AddItem parentId={parentId} />
              )}
            </div>
          )
        })}
      </div>
    )
  }
}

Answer 1

添加检查 parentId 是否等于 item.parentId:

{isFormOpen && parentId === item.parentId && (
    <AddItem parentId={parentId} />
)}