Reactjs 如何在react上隐藏/显示特定组件

我有一个显示两个图表的组件，我想为每个图表创建一个显示或隐藏图表的按钮。我已经找到了如何隐藏和显示，但它不适合我，因为它隐藏或显示所有图表，任何帮助都会得到很好的响应

顺便说一句，我是个全新的反应者，所以如果我表达得不好，我向你道歉

到目前为止，我的代码是：

导出默认类Home extends组件{ 构造器程序，上下文{ 超级程序，上下文； this.handleShow=this.handleShow.bindthis； this.handleHide=this.handleHide.bindthis； 此.state={ 秀:假,， 伊希登：没错， }; } 拨动{ 这是我的国家{ isHidden:！this.state.isHidden， }; } 渲染{ 如图所示={ 显示：this.state.ishiden？内联块：无 }; 让隐藏={ 显示：this.state.ishiden？无：内联块 }; 回来 格拉菲科斯 ODC的 onClick={this.toggle.bindthis} 奥迪的 白鹭 安格洛斯 埃斯帕西奥斯伦塔多斯酒店 {/*ODC的COLOCADAS*/}

---

JanneP在评论上的逻辑是正确的，但是如果您想将逻辑保留在容器上，那么您需要为每个项目设置某种键或索引

因此，按钮可以如下所示：

<button onClick={ () => {
        // keep the state
        let shown = [ ...this.state.shown ];
        // revert the stored boolean to toggle
        shown.chart1 = !shown.chart1
        this.setState({ shown });
    }
} />

图表可以是：

// If not familiar with the ternary: that is just shorthand if statement
<Chart style={ this.state.shown.chart1 ? { display: 'inline-block' } : { display: 'none' } } />

---

天哪，你能把你提供的代码缩短一点吗？这是一个相当多的过程。你的显示/隐藏技术完全可以，但是可以将大量的html拆分成子组件，并切换这些组件的可见性。这对我很有帮助。谢谢你，我能意识到的唯一缺点是，在我点击任何按钮时，它都会显示图表，但也隐藏了其余部分：c@KarenSamnao嗯，这个逻辑不应该。你能将你的完整代码粘贴到bin吗？或者你有笔吗？@KarenSamano嗯，对我来说，代码的格式似乎不是很好，所以有点难理解。但至少有一个问题是：你正在设置show.ODI，但后来检查show.ODC。。。