日韩性视频-久久久蜜桃-www中文字幕-在线中文字幕av-亚洲欧美一区二区三区四区-撸久久-香蕉视频一区-久久无码精品丰满人妻-国产高潮av-激情福利社-日韩av网址大全-国产精品久久999-日本五十路在线-性欧美在线-久久99精品波多结衣一区-男女午夜免费视频-黑人极品ⅴideos精品欧美棵-人人妻人人澡人人爽精品欧美一区-日韩一区在线看-欧美a级在线免费观看

歡迎訪問 生活随笔!

生活随笔

當前位置: 首頁 > 编程资源 > 编程问答 >内容正文

编程问答

Django模板语言中的自定义方法filter过滤器实现web网页的瀑布流

發(fā)布時間:2023/12/9 编程问答 23 豆豆
生活随笔 收集整理的這篇文章主要介紹了 Django模板语言中的自定义方法filter过滤器实现web网页的瀑布流 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

模板語言自定義方法介紹

自定義方法注意事項

Django中有simple_tag 和 filter 兩種自定義方法,之前也提到過,需要注意的是

  • 擴展目錄名稱必須是templatetags
  • templatetags中的自定義標簽和過濾器必須依賴于一個django app,也就是說,自定義標簽和過濾器是綁定app的。該app應該包含一個templatetags目錄,這個目錄一個和model.py,views.py在同一個層級
  • 包含templatetags目錄的app一定要在INSTALLED_APPS列表里面
  • 在頁面中使用{% load %}加載擴展方法,load的是模塊名,而不是app名
  • 記得使用 from django import template ,register=template.Library()注冊
  • simple_tag 和 filter 的區(qū)別

    • simple_tag:可以有多個參數,一般是做數據處理,但不能做if判斷語句
    • filter:一般只能有1個參數(可以字符串切割,變通為多個參數),過濾器,一般是return true或者false,可以和if判斷語句使用.在過濾器 {{ var|foo:"bar" }} 中 ,過濾器 foo 會被傳入變量 var 和默認參數 bar。過濾器函數應該總有返回值

    使用方法

    目錄結構

    xx.py代碼:

    #需要從django中導入一些模塊 from django import template from django.utils.safestring import mark_safe from django.template.base import resolve_variable, Node, TemplateSyntaxError register = template.Library() @register.filter def detail1(value,arg): """ 查看余數是否等于remainder arg="1,2" :param counter: :param allcount: :param remainder: :return: """ allcount, remainder = arg.split(',') allcount = int(allcount) remainder = int(remainder) if value%allcount == remainder: return True return False @register.simple_tag def my_simple_time(v1,v2,v3): return v1 + v2 + v3

    simple_tag 頁面使用

    {% load xx %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> {% my_simple_time 1 2 3 %} </body> </html>

    filter 頁面使用

    {% load xx %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> {{ 23|detail4:"4,0" }} {% if 23|detail4:"4,0" %} <h1>123</h1> {% endif %} </body> </html>

    頁面實現瀑布流

    布局介紹

    由于圖片有大有小,所以為了頁面的整齊,沒有空隙,可以將頁面body主體分為4列,每一列依次往下排列圖片和介紹即可.

    由于頁面是從左到右排序的,所以我們可以將圖片的列隊索引+1后除以4后得到的余數,就是所在頁面中所在的列數,所以可以使用python中的div()函數來處理.

    代碼

    擴展方法代碼:xx.py 文件

    from django import template from django.utils.safestring import mark_safe from django.template.base import resolve_variable, Node, TemplateSyntaxError register = template.Library() @register.filter def detail1(value,arg): """ 查看余數是否等于remainder arg="1,2" :param counter: :param allcount: :param remainder: :return: """ allcount, remainder = arg.split(',') allcount = int(allcount) remainder = int(remainder) if value%allcount == remainder: return True return False

    views.py范例

    from django.shortcuts import render# Create your views here.def student(request): img_list = [ {'src': '1.jpg', 'title': 'asdfasdfasdf','content': 'asdf'},# 1 {'src': '2.jpg', 'title': 'asdfasdfasdf','content': 'asdf'},# 2 {'src': '3.jpg', 'title': 'asdfasdfasdf','content': 'asdf'}, {'src': '4.jpg', 'title': 'asdfasdfasdf','content': 'asdf'}, {'src': '18.jpg', 'title': 'asdfasdfasdf','content': 'asdf'},# 5 {'src': '21.jpg', 'title': 'asdfasdfasdf','content': 'asdf'}, ] return render(request, 'student.html', {"img_list":img_list})

    html頁面代碼

    {% load xx %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <style> .container{ width: 980px; margin: 0 auto; } .container .column{ float: left; width: 245px; } .container .item img{ width: 245px; } </style> </head> <body> <div class="container"> <div class="column"> {% for i in img_list %} {% if forloop.counter|detail1:"4,1" %} <div class="item"> {{ forloop.counter }} <img src="/static/{{ i.src }}"> </div> {% endif %} {% endfor %} </div> <div class="column"> {% for i in img_list %} {% if forloop.counter|detail1:"4,2" %} <div class="item"> {{ forloop.counter }} <img src="/static/{{ i.src }}"> </div> {% endif %} {% endfor %} </div> <div class="column"> {% for i in img_list %} {% if forloop.counter|detail1:"4,3" %} <div class="item"> {{ forloop.counter }} <img src="/static/{{ i.src }}"> </div> {% endif %} {% endfor %} </div> <div class="column"> {% for i in img_list %} {% if forloop.counter|detail1:"4,0" %} <div class="item"> {{ forloop.counter }} <img src="/static/{{ i.src }}"> </div> {% endif %} {% endfor %} </div> </div> </body> </html>

    轉載于:https://www.cnblogs.com/zxmbky/p/9769153.html

    創(chuàng)作挑戰(zhàn)賽新人創(chuàng)作獎勵來咯,堅持創(chuàng)作打卡瓜分現金大獎

    總結

    以上是生活随笔為你收集整理的Django模板语言中的自定义方法filter过滤器实现web网页的瀑布流的全部內容,希望文章能夠幫你解決所遇到的問題。

    如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。