单击一个按钮关闭所有按钮答案

【问题标题】：All buttons close on click of one button单击一个按钮关闭所有按钮
【发布时间】：2022-12-18 12:49:55
【问题描述】：

请问我正在建立一个常见问题解答页面，我制作了一系列按钮，单击这些按钮时会在每个按钮下方显示一个隐藏的段落，现在问题是所有按钮都会响应一个按钮被单击并且它们都显示各自的段落，我想要每个按钮单独显示它自己的隐藏段落。

这是我使用的反应代码

class FAQ extends React.Component {
    constructor () {
      super()
      this.state = {
        isHidden: true,
      }
    }

    toggleHidden () {
      this.setState({
        isHidden: !this.state.isHidden})
    }

            <div className="faq--button">
                <button onClick={this.toggleHidden.bind(this)}>button to click</button>
                {!this.state.isHidden && <p>lorem ipsum"</p>}
            </div>

【问题讨论】：

您需要为每个按钮设置一个状态。

标签： reactjs react-hooks toggle

【解决方案1】：

目前 isHidden 用于所有按钮，这将在每个按钮中具有相同的效果。所以你需要为每个按钮添加单独的状态。比如 isHidden2, isHidden3....

【讨论】：