flask 设置导航栏

在 Flask 中设置导航栏可以通过使用 Flask-Bootstrap 扩展来实现。Flask-Bootstrap 是一个 Flask 扩展，它提供了一组 Bootstrap 模板，可以用来快速构建美观的网站。

以下是设置导航栏的步骤：

1. 安装 Flask-Bootstrap 扩展：

   pip install flask-bootstrap

2. 在 Flask 应用中初始化 Bootstrap：

   from flask import Flask
   from flask_bootstrap import Bootstrap

   app = Flask(__name__)
   bootstrap = Bootstrap(app)

3. 在 HTML 模板中使用导航栏模板：

   {% from "bootstrap/nav.html" import nav %}

   <nav class="navbar navbar-expand-lg navbar-light bg-light">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Brand</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>
       <div class="collapse navbar-collapse" id="navbarNav">
         {{ nav() }}
       </div>
     </div>
   </nav>

4. 在 Flask 视图函数中指定导航栏选项：

   from flask import render_template

   @app.route('/')
   def index():
       return render_template('index.html', title='Home')

   @app.route('/about')
   def about():
       return render_template('about.html', title='About', active='about')

在上面的例子中，`active` 参数表示当前选中的导航栏选项。在 about 视图函数中，我们将 `active` 参数设置为 `'about'`，表示当前选中的是关于页面。

5. 在 HTML 模板中使用 `active` 参数：

   {% from "bootstrap/nav.html" import nav %}

   <nav class="navbar navbar-expand-lg navbar-light bg-light">
     <div class="container-fluid">
       <a class="navbar-brand" href="#">Brand</a>
       <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
         <span class="navbar-toggler-icon"></span>
       </button>
       <div class="collapse navbar-collapse" id="navbarNav">
         {{ nav(active=active) }}
       </div>
     </div>
   </nav>

在上面的例子中，我们将 `active` 参数传递给了 `nav()` 函数，用于设置当前选中的导航栏选项。

这样就完成了导航栏的设置。您可以根据自己的需求修改导航栏的样式和选项。