React单开手风琴实现后无法关闭当前展开项问题求助

问题核心是toggleAnswer函数的更新逻辑缺失判断，你当前的代码无论点击的条目是否已展开，都会直接将idFlag设置为传入的id，所以无法关闭已展开的条目。只需要修改App.js中的toggleAnswer逻辑即可：

// App.js 中修改toggleAnswer函数
const toggleAnswer = (id) => {
  setIdFlag(prevId => prevId === id ? null : id)
}

逻辑说明 #

• 如果点击的是当前已经展开的条目（传入的id和当前idFlag相等），就将idFlag设置为null，关闭该条目
• 如果点击的是未展开的条目，就将idFlag设置为对应id，展开该条目同时自动关闭其他所有条目
• 其余代码不需要做任何改动，原有SingleQuestion的显示逻辑可直接复用

内容的提问来源于stack exchange，提问作者emre-ozgun