React页面加载时菜单自动选中问题求助（用react-burger-menu）

这个选中框是浏览器默认的焦点轮廓（outline）——当你用isOpen={true}强制菜单默认展开时，组件内部会自动把焦点定位到菜单区域的某个元素上，触发了浏览器自带的焦点样式。

给你两个可行的解决办法：

方法1：用CSS移除焦点轮廓 #

直接给菜单相关元素加样式覆盖默认的outline：

.bm-menu, .bm-menu * {
  outline: none;
}

这种方式简单直接，能一次性去掉菜单内所有元素的焦点轮廓。

方法2：通过组件属性禁用自动聚焦 #

react-burger-menu本身提供了disableAutoFocus属性，设为true就能阻止组件在打开时自动聚焦元素，从根源上避免这个问题：

<slideMenu
  isOpen={true}
  disableAutoFocus={true}
  // 你的其他配置属性
>
  {/* 菜单内容 */}
</slideMenu>

这种方式更贴合组件的设计逻辑，不会影响页面其他元素的焦点样式。

选其中一种方法就能解决你遇到的问题了。

内容的提问来源于stack exchange，提问作者marlon