通过在模板中比对 `request.endpoint` 与路由端点名，可自动为 bootstrap 5 导航项添加 `active` 类，实现点击后持久高亮，无需手动传递变量。
在 Flask 应用中集成 Bootstrap 5 导航栏时，常遇到“点击后 active 类不持久”的问题——这通常是因为依赖前端行为（如 hover）或错误地使用了静态模板变量（如 active_page = "edit_profile.html"），而未真正关联当前请求的路由上下文。
正确做法是利用 Flask 的 request.endpoint 属性：它返回当前请求所匹配视图函数的完整端点名（如 'auth.edit_profile'），该值在每次请求时由 Flask 自动注入，精准反映用户实际访问的页面，无需在每个子模板中手动设置变量。
以下是推荐的实现方式（适配 Bootstrap 5 语义结构）：
<nav class="navbar navbar-expand-md navbar-dark bg-dark">
<div class="container-fluid">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link{% if request.endpoint == 'auth.edit_profile' %} active{% endif %}"
href="{{ url_for('auth.edit_profile') }}">编辑资料</a>
</li>
<li class="nav-item">
<a class="nav-link{% if request.endpoint == 'main.index' %} active{% endif %}"
href="{{ url_for('main.index') }}">首页</a>
</li>
<li class="nav-item">
<a class="nav-link{% if request.endpoint == 'auth.logout' %} active{% endif %}"
href="{{ url_for('auth.logout') }}">退出登录</a>
</li>
</ul>
</div>
</div>
</nav>✅ 关键要点说明：
- 使用 navbar-nav 和 nav-item / nav-link 是 Bootstrap 5 官方推荐的导航结构，确保样式与 JS 行为（如折叠、下拉）正常；
- request.endpoint 在 Jinja2 模板中直接可用，无需额外导入或配置；
- 端点名必须与 @app.route() 或蓝图注册时的函数名完全一致（含蓝图前缀，如 'auth.edit_profile'）；
- 避免使用 request.path 或 request.url_rule，它们易受 URL 参数、重定向或路径别名影响，可靠性低。
⚠️ 注意事项：
- 若使用蓝图，务必确认端点命名规范（默认为 blueprint_name.view_function_name）；可通过 flask routes 命令查看全部端点列表；
- 不要混用 class="active" 在 <li> 上（旧版 Bootstrap 习惯），Bootstrap 5 推荐将 active 加在 <a class="nav-link"> 元素上，否则可能丢失 CSS 样式或 JS 功能；
- 若需支持多级嵌套路由（如 /user/123/profile），仍应基于端点判断，而非解析 URL 字符串——更健壮、更符合 Flask 设计哲学。
此方案简洁、可靠、零侵入，是 Flask + Bootstrap 5 导航高亮的标准实践。
