Question

我有一个base.html文件，其中包含blovk内容并由manage.html扩展。 manage.html有一个block sub_manage，由internet_market.html扩展，所以在视觉上它看起来像：

|- base.html (block content)
|--manage.html (extends base.html)
|---sub_manage.html (extends manage.html)

当我render_template mange.html一切正常时，但是当我尝试render_template sub_manage.html时，css / javascript不起作用。我该怎么做才能克服这个问题？

这是我的base.html

<head>  
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="../static/css/bootstrap.min.css">
<script type="text/javascript" src="../static/js/bootstrap.min.js"></script>
<style type="text/css">
</head>
<body>
    <div id="left_sidebar">
        <ul>
            <li class="main"><a href="{{ url_for('cabinet.index', current = 'main') }}"> + Главная</a></li>
            <li class="main"><a href="{{ url_for('cabinet.orders') }}">Заказы</a></li>
            <li class="main"><a href="{{ url_for('cabinet.manage') }}"> - Управление сайтом</a></li>
        </ul>
    </div>
    <div id="content">
        {% block content %}{% endblock %}
    </div>
</body>

这是我的manage.html文件：

{% extends "admin/base.html" %}
{% block content %} 
    <!-- Nav tabs -->
    <div>
        <ul class="nav nav-tabs" role="tablist">
            <li class="dropdown active"></li>
        </ul>
    </div>
    <!-- Tab panes -->
    <div class="manage_menu_settings">
        {% include 'admin/manage/site_figuraiton.html' %}
    </div>

    {% block sub_manage%}
    {% endblock %}

{% endblock %}

这是internet_market.html

{% extends "admin/manage.html" %}
{% block sub_manage %}  
    <div class="tab-content">
        <div class="tab-pane {% if current == 'delivery_settings' %} active{% endif %}" id="delivery_settings">
            Настройки доставки, корзины и оплаты
        </div>
        <div class="tab-pane {% if current == 'delivery_type' %} active{% endif %}" id="delivery_type">
            Добавить способы доставки
        </div>
{% endblock%}

Answer 1

解决了这个问题。问题是我链接我用于css和js文件的相对链接，因此当试图渲染2级扩展它没有找到css / js。所以它就像：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="../static/css/bootstrap.min.css">
<script type="text/javascript" src="../static/js/bootstrap.min.js"></script>
<style type="text/css">

然后我将这些链接更改为url_for的动态链接，它的工作方式如下：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="{{url_for("static", filename = "css/bootstrap.min.css")}}">
<script type="text/javascript" src="{{url_for("static", filename = "js/bootstrap.min.js")}}"></script>
<style type="text/css">

Jinja2模板 - 延伸2级

1 个答案: