Jinja根据页面修改base.html

Question

我在flask项目的模板中使用jinja。

我的问题是:当你在相应的页面上时，如何改变侧边栏(这是在base.html文件)的元素之一的颜色?

我的意思是，假设我有一个边栏，上面有以下标题链接到相应的页面:dashboard, feature1, feature2。

如果我想让feature1改变颜色，当我在feature1上，然后改变回feature1的原始颜色，当我点击并进入仪表板页面时，把仪表板变成选定的颜色，我该怎么做?

因为我真的不知道如何简单地做到这一点，而不是在每个页面的html模板中创建一个新的内容。

提前感谢!

Answer 1

可以为活动链接使用CSS类。这定义了当前使用页面的菜单项的样式属性。

.active {
background-color: red;
}

要将类添加到菜单项，可以使用request对象使用一个简单的if条件。在这里，您可以比较当前请求是否与端点的标识符相同。

@app.route('/')
def dashboard():
# ...

<a 
class="{% if request.endpoint == 'dashboard' %}active{% endif %}" 
href="{{ url_for('dashboard') }}"
>Dashboard</a>