有什么办法可以编辑 Django 模板吗？

Question

在代码的最后一部分，存在一个 for 循环，它有助于构建 boostrap crousel，但为了使网站响应，我需要删除该 forloop。那么有什么方法可以达到响应速度吗？

            <div class="carousel-item active">

                {% for i in products %}
                <div class="col-xs-3 col-sm-3 col-md-3">
                    <div class="card align-items-center" style="width: 18rem;">
                        <img src='/media/{{i.image}}' class="card-img-top mt-2" alt="...">
                        <div class="card-body">
                            <h5 id="productName{{i.id}}" class="card-title">{{i.product_name}}</h5>
                            <p id="productPrice{{i.id}}" class="card-text">₹ {{i.price}}</p>
                            <span id='button{{i.id}}'>
                                <div id='product{{i.id}}' class="btn btn-primary cart">Add to cart</div>
                            </span>
                            <a href="/shop/productView/{{i.id}}" id="quickView{{i.id}}"
                                class="btn btn-primary ml-3">Quick view</a>
                        </div>
                    </div>
                </div>
                {% if forloop.counter|divisibleby:4 and forloop.counter > 0 and not forloop.last %}
            </div>
            <div class="carousel-item">
                {% endif %}
                {% endfor %}
            </div>
        </div>

Answer 1

我没有任何从模板中删除代码的解决方案（JS 可能使它工作，但我没有任何技能）。

相反，这里有一个使用 Django 使您的模板更具响应性的想法。

您可以在您的视图中获取用户代理：

views.py

user_agent = request.META['HTTP_USER_AGENT']

如果你打印它，你会得到类似的东西：

>> print(user_agent)
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) 
AppleWebKit/537.36 (KHTML, like Gecko) 
Chrome/**.*.****.***
Safari/537.36

然后您可以设置一个关键字列表来检查用户代理是否指的是移动设备并为您上下文中的变量赋值：

views.py

keywords = ['Mobile','Opera Mini','Android']

if any(word in user_agent for word in keywords):
    context['is_mobile'] = True
else:
    context['is_mobile'] = False

最后在模板中设置一个 if 语句：

your_page.html

{% if is_mobile == False %}
<div class="carousel-item active">

                {% for i in products %}
                <div class="col-xs-3 col-sm-3 col-md-3">
                    <div class="card align-items-center" style="width: 18rem;">
                        <img src='/media/{{i.image}}' class="card-img-top mt-2" alt="...">
                        <div class="card-body">
                            <h5 id="productName{{i.id}}" class="card-title">{{i.product_name}}</h5>
                            <p id="productPrice{{i.id}}" class="card-text">₹ {{i.price}}</p>
                            <span id='button{{i.id}}'>
                                <div id='product{{i.id}}' class="btn btn-primary cart">Add to cart</div>
                            </span>
                            <a href="/shop/productView/{{i.id}}" id="quickView{{i.id}}"
                                class="btn btn-primary ml-3">Quick view</a>
                        </div>
                    </div>
                </div>
                {% if forloop.counter|divisibleby:4 and forloop.counter > 0 and not forloop.last %}
            </div>
            <div class="carousel-item">
                {% endif %}
                {% endfor %}
            </div>
        </div>
{% endif %}

您可以在 this topic 上找到对您也有帮助的有价值的信息。

有什么办法可以编辑 Django 模板吗？

Is there any way to edit django template?

html

django

django-templates

responsive-design