Django实战（7）：改造ProductList界面-白红宇

Django实战（7）：改造ProductList界面

阅读量：6903 次

发布时间：2019-06-27

本文共 1447 字，大约阅读时间需要 4 分钟。

有了关于Django模板的基础，改造界面就很容易理解了。将界面设计师设计的页面中的内容根据复用程度分别放到基础模板base.html和专用模板productlist.html中。

depot/templates/base.html

    
         
         
         
         {% block title %} 标题 {% endblock %}    
     
     
          {
    % block content %}     内容    {
    % endblock %}

base作为整个网站的基础布局，包含了所有页面都需要的bootstrap.min.css。同时设置了两个内容块（title, content)。在productlist.html中替换这两个内容块：

depot/templates/depotapp/list_product.html

{% extends "base.html" %}{
    % block title %} 产品清单 {% endblock %}{
    % block content %} 
             
          
       产品清单
      
{
    % for item in list_items.object_list %}
          
               
                            
       
    
               
        {
   {item.title}}
        {
    {item.description}}    
       
    
               
        查看 
        
        编辑 
        
        删除
    
       
      
{
    % endfor %}{
    % if list_items.has_previous %}    
      上一页{
    % endif %}
          第{
    { list_items.number }}页，共{
    { list_items.paginator.num_pages }}页{
    % if list_items.has_next %}        
      下一页{
    % endif %}
      新增产品
{
    % endblock %}

先是声明这个模板继承自base.html，然后是两个内容块的实现。

注意其中链接的写法：href="{% url depotapp.views.view_product item.id %}"。这样定义的href是关联到view函数，而不是硬编码的URL。在以后如果改变了URLconf的定义，不需要再更改模板。这个功能不是rails特有的！

关于分页的部分，无需关注，以后再说。

最后，认真填写一下表单，将真正的数据存到数据库，就可以在http://localhost:8000/depotapp/product/list/ 看到漂亮的界面了。

例子中使用的书籍信息和图片链接均来自

转载于:https://www.cnblogs.com/wuxl360/p/5787807.html

你可能感兴趣的文章

产品清单

{ {item.title}}

{
{item.title}}