Hiểu về kế thừa mẫu trong Django
Một trong những tính năng mạnh mẽ nhất của Django là khả năng sử dụng lại mã động. Kế thừa mẫu cho phép chia sẻ mã giữa mẫu cha và mẫu con. Nó làm giảm đáng kể sự trùng lặp của nỗ lực.
Django có ngôn ngữ mẫu được thiết kế để pha trộn với HTML. Bạn sẽ dễ dàng làm việc với các mẫu của Django nếu bạn đã từng làm việc với mã HTML trước đây. Các ngôn ngữ mẫu dựa trên văn bản khác như Smarty hoặc Jinja2 có cú pháp tương tự.
Hãy tìm hiểu thêm về kế thừa mẫu bằng cách xây dựng một dự án Django.
Mục Lục
Mẫu Django là gì?
Trong Django, mẫu là một tệp văn bản có thể tạo bất kỳ định dạng dựa trên văn bản nào, chẳng hạn như HTML, XML hoặc CSV.
Các thẻ mẫu Django kiểm soát logic kèm theo các biến và giá trị trong mẫu. Các thẻ giúp tách logic chương trình khỏi cách trình bày mẫu. Chúng cũng giúp giữ cho các mẫu của bạn sạch sẽ và có tổ chức.
Django có nhiều thẻ tích hợp, trông giống như {% nhãn %}. Thẻ rất hữu ích theo nhiều cách. Họ có thể tạo văn bản ở đầu ra, thực hiện các vòng lặp và tải thông tin vào mẫu.
Bạn sẽ sử dụng các thẻ trong dự án này để chứng minh tính kế thừa của mẫu.
Tạo một dự án Django
Để bắt đầu, hãy tạo một dự án Django. Tạo một ứng dụng có tên mẫu. Sau khi hoàn thành, bạn đã sẵn sàng tạo chức năng xem cho ứng dụng, đường dẫn URL và các mẫu để thể hiện tính kế thừa của mẫu.
Tạo một chức năng xem
Đầu tiên, tạo một lượt xem chức năng hiển thị các mẫu. Trong trường hợp này, bạn sẽ kết xuất index.html mẫu. Nhập khẩu kết xuất phương pháp từ các phím tắt Django. Sau đó, tạo một hàm xem có tên là chỉ mục trả về và hiển thị mẫu chỉ mục.
from django.shortcuts import render
def index(request):
return render (request,'index.html')Tạo một đường dẫn URL
Tiếp theo, tạo một đường dẫn URL cho chức năng xem để hiển thị các mẫu. Nhập khẩu đường dẫn chức năng từ django.urls và lượt xem chức năng từ lượt xem.py tập tin. Sau đó nhập cài đặt và tĩnh để hiển thị bất kỳ hình ảnh và phương tiện nào bạn có thể có trong các mẫu.
from django.urls import path
from . import views
from django.conf import settings
from django.conf.urls.static import static
urlpatterns=[
path('',views.index,name='index'),
]
if settings.DEBUG:
urlpatterns+=static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)Tạo mẫu
Bây giờ bạn đã có lượt xem và URL đường dẫn, tạo các mẫu. Để chứng minh tính kế thừa mẫu, hãy tạo một cơ sở.html như một mẫu cha mẹ. Các cơ sở.html tệp sẽ có các thành phần chung mà bạn muốn chia sẻ index.html, mẫu con.
{% load bootstrap5 %}
{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- titles -->
{% if title %}
<title> Inherited Templates {{title}}</title>
{% else %}
<title> Inherited Templates </title>
{% endif %}
{% block styles %}
{% bootstrap_css %}
<link rel="stylesheet" href="{% static 'css/style.css' %}">
{% endblock %}
</head>
<body>
{% include 'navbar.html' %}
{% block content %} {% endblock %}
<!-- Bootstrap links -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"> </script>
</body>
</html>Đầu tiên, tải Bootstrap và các phụ thuộc tĩnh vào cơ sở.html mẫu. Bạn có thể sử dụng khung Bootstrap với dự án Django của mình để tạo kiểu cho các trang HTML. Phụ thuộc tĩnh được tải ở trên cùng sẽ tải nội dung có trong thư mục tĩnh.
Các mẫu Django cho phép bạn chuyển các bit logic chịu trách nhiệm hiển thị nội dung. Thẻ mẫu bao gồm văn bản được bao quanh bởi “{%“ và “%}” nhân vật. Các nếu khác câu lệnh kiểm tra các điều kiện trong chức năng xem. Nếu điều kiện là đúng, nó sẽ hiển thị nội dung trong khối đầu tiên; nếu sai, nó sẽ hiển thị nội dung trong lần thứ hai.
Các cơ sở.html tệp cũng sẽ hiển thị nội dung của thanh điều hướng.html ngay tại nơi bạn đặt các thẻ mẫu. Điều đó có nghĩa là bất cứ khi nào bạn mở rộng cơ sở.html, thanh điều hướng.html cũng được kế thừa. Bất kỳ mẫu nào mở rộng cơ sở.html sẽ kế thừa bất kỳ phần tử nào với một {% bao gồm %} nhãn.
Bất kỳ văn bản nào được bao quanh bởi {{}} là một biến mẫu. Các biến mẫu là dữ liệu động được cung cấp bởi các hàm xem. Django cũng sử dụng các thẻ khối sử dụng thẻ mở, như {% khối nội dung %}và một thẻ đóng, như {% khối cuối %}.
Các thẻ chặn cho phép các mẫu con ghi đè lên nội dung của các mẫu gốc. Trong trường hợp này, các index.html có thể thay thế nội dung của nó trong khu vực được bao quanh bởi các thẻ khối. Nó sẽ không can thiệp vào khác cơ sở.html các thành phần.
Hãy áp dụng logic vào index.html
{% extends 'base.html' %}
{% block content %}
<div class="container text-center" style="color: white">
<h1>I Am The Index Template</h1>
<p>I inherited Bootstrap and the navbar from base.html</p>
</div>
{% endblock %}
bên trong index.html mẫu, sử dụng {% gia hạn %} thẻ để mở rộng các thành phần của cơ sở.html. Bên trong các thẻ khối {% khối nội dung %}hãy viết tất cả mã của bạn.
bên trong index.html mẫu, bạn có phần tử H1 và đoạn văn. Bạn có thể sử dụng các thẻ mẫu bên trong các div để gọi các biến từ lượt xem hàm số.
Kiểm tra kế thừa mẫu trong trình duyệt
Bây giờ bạn có thể chạy máy chủ. Khi bạn đã làm như vậy, hãy kiểm tra trong trình duyệt để xem liệu index.html tệp kế thừa các phần tử của cơ sở.html. Điều đó bao gồm các liên kết Bootstrap và thanh điều hướng.html mẫu.
Các index.html tệp phải kế thừa các kiểu thanh điều hướng và Bootstrap từ mẫu cơ sở. Nếu vậy, bạn đã sử dụng kế thừa mẫu một cách chính xác. Nếu không có nó, bạn sẽ phải thêm thanh điều hướng và liên kết Bootstrap vào nơi bạn cần.
Ngoài ra, bất kỳ thay đổi nào bạn thực hiện đối với cơ sở.html sẽ phản ánh trên tất cả các mẫu mà nó mở rộng. Nguyên tắc này rất quan trọng trong việc xử lý lỗi. Bạn có thể dễ dàng Xác định các mẫu có lỗi.
Kế thừa mẫu là một trong nhiều cách Django thực hiện nguyên tắc Không lặp lại chính mình (DRY). Nó sẽ làm cho sự phát triển của bạn dễ dàng và đơn giản hơn nhiều.
Tại sao bạn nên sử dụng kế thừa mẫu Django
Kế thừa mẫu của Django là một trong những tính năng phức tạp nhất của nó. Có thể mất một chút thời gian để hiểu nó, nhưng một khi bạn hiểu, nó sẽ tiết kiệm rất nhiều nỗ lực phát triển.
Kế thừa mẫu cho phép bạn chia sẻ mã giữa mẫu mẹ và mẫu con. Điều này đảm bảo bạn không viết mã lặp lại trong các mẫu của mình.
Kế thừa mẫu rất quan trọng trong các dự án Django lớn. Trong những trường hợp như vậy, có rất nhiều ứng dụng và nhiều mẫu để thiết kế. Các mẫu gốc cung cấp cho bạn nhiều quyền kiểm soát đối với các thành phần khác của ứng dụng.
Bằng cách tìm hiểu hệ thống mẫu Django, bạn có thể tận hưởng việc viết mã rõ ràng và mạnh mẽ.