Bootstrap 5.0.2 hamburger menu（汉堡菜单）点击无法展开问题问询

问题原因 #

你使用的是Bootstrap 5版本，代码存在两处问题导致汉堡菜单无法正常触发：

1. Bootstrap 5对所有交互组件的自定义数据属性新增了bs-前缀，你当前按钮上使用的data-toggle、data-target是Bootstrap 4的旧写法，在Bootstrap 5中无法被识别
2. 汉堡菜单的交互逻辑依赖Bootstrap 5自带的JS组件，即使不需要jQuery，也需要引入对应JS文件才能正常工作

修复方案 #

• 首先修正导航栏触发按钮的属性，替换为Bootstrap 5规范的写法：

<button class="navbar-toggler" style="margin-right:5px !important;" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent">
    <span class="navbar-toggler-icon"></span>
</button>

• 在页面中引入Bootstrap 5官方提供的JS bundle文件（已内置所需的Popper依赖，不需要额外引入jQuery）。

修改完成后点击汉堡图标即可正常展开折叠菜单。

内容的提问来源于stack exchange，提问作者Mr.M