reactjs / reactjs/react.dev

[Bug]: Sidebar dropdown does not close when the arrow is clicked again

未关闭 适合新手
#8,618 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

bug: unconfirmed
主要语言
JavaScript
星标
11.8k
派生
7.9k
平均合并
1 天 11 小时
30 天内合并 PR
11

描述

Summary

In the left sidebar navigation, when a section with sub-items is expanded (for example, "Installation"), clicking its downward-facing arrow again does not collapse the section. Users naturally expect an expand/collapse toggle arrow to work in both directions — even if this is intentional (e.g., to keep the active page's context visible), it hurts the UX since users assume clicking again will close the dropdown.

Page

https://react.dev/learn/installation

Details

To Reproduce

  1. Go to any documentation page with an expanded sidebar section, such as https://react.dev/learn/installation.
  2. Locate the left sidebar navigation.
  3. Click on the downward-facing arrow next to the currently active/expanded section (e.g., "Installation").
  4. Notice that the section does not collapse as expected.

Expected behavior
Clicking the dropdown arrow of an already expanded section should toggle it back to a collapsed state.

Desktop:

  • OS: Windows
  • Browser: Chrome

Additional context
Observed on the main react.dev documentation site. Fixing this would make the navigation feel more intuitive and aligned with standard UI patterns for accordions/dropdowns.

贡献指南

打开贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

调研方向

https://react.dev/learn/installation 的侧边栏开始,跟踪文档站点中已展开部分的箭头点击处理程序。先在 Chrome 中复现该行为,然后验证再次点击箭头会折叠该部分,同时导航和当前页面上下文仍然正常工作。

由索引模型根据 Issue 内容生成。

评估

技术栈
javascript, react
领域
documentation, frontend
Issue 类型
缺陷
难度
2/5
预计耗时
1-3 小时
活跃度
活跃
描述清晰度
基本清楚
新手友好度
68/100

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。