Xây dựng chế độ xem động và mẫu trong Django

Django là một framework mạnh mẽ giúp dễ dàng xây dựng các ứng dụng web động. Trong bài viết này, chúng ta sẽ khám phá cách xây dựng các chế độ xem và mẫu động trong Django, bắt đầu từ các khái niệm cơ bản đến các kỹ thuật nâng cao hơn. Chúng ta sẽ đề cập đến cách truyền dữ liệu từ chế độ xem sang mẫu và cách sử dụng thẻ mẫu để tạo nội dung động dựa trên dữ liệu đó.

Chế độ xem trong Django là gì?

Trong Django, view là một hàm Python hoặc thành phần dựa trên lớp tiếp nhận yêu cầu web và trả về phản hồi web. Phản hồi có thể là trang HTML, đối tượng JSON hoặc bất kỳ loại nội dung nào khác. View cho phép bạn tạo nội dung động dựa trên yêu cầu của người dùng.

Tạo một chế độ xem đơn giản

Để tạo chế độ xem trong Django, bạn cần định nghĩa một hàm trong tệp views.py của ứng dụng Django. Hàm này nhận một yêu cầu HTTP và trả về phản hồi HTTP. Ví dụ:

from django.shortcuts import render

def home(request):
    return render(request, 'home.html')

Chế độ xem đơn giản này hiển thị mẫu "home.html". Nhưng chúng ta có thể làm cho nó động hơn bằng cách truyền dữ liệu từ chế độ xem đến mẫu.

Truyền dữ liệu vào mẫu

Để truyền dữ liệu từ chế độ xem đến mẫu, bạn có thể sử dụng từ điển trong đối số ngữ cảnh khi gọi hàm render. Ví dụ, hãy sửa đổi chế độ xem "home" để truyền thông điệp động đến mẫu:

def home(request):
    context = {
        'message': 'Welcome to my website!'
    }
    return render(request, 'home.html', context)

Bây giờ, trong mẫu "home.html", bạn có thể truy cập vào biến `message`:

<h1>{{ message }}</h1>

Thao tác này sẽ hiển thị thông báo được truyền từ chế độ xem: "Chào mừng đến với trang web của tôi!"

Sử dụng Thẻ Mẫu cho Nội dung Động

Các mẫu Django hỗ trợ các thẻ mẫu mạnh mẽ giúp tạo nội dung động trong HTML của bạn. Một số thẻ mẫu phổ biến là:

{% if %}... {% endif %} cho các câu lệnh có điều kiện.
{% for %}... {% endfor %} để lặp lại dữ liệu.
{{ biến }} để chèn các giá trị động vào HTML.

Sử dụng câu lệnh If

Hãy thêm một thông báo động chỉ xuất hiện nếu một điều kiện nhất định là đúng. Sửa đổi chế độ xem "home" để truyền một điều kiện:

def home(request):
    context = {
        'message': 'Welcome to my website!',
        'user_logged_in': True
    }
    return render(request, 'home.html', context)

Trong mẫu, bạn có thể sử dụng câu lệnh if để hiển thị thông báo chào mừng chỉ khi người dùng đã đăng nhập:

{% if user_logged_in %}
    <p>You are logged in!</p>
{% else %}
    <p>Please log in to access more features.</p>
{% endif %}

Lặp qua dữ liệu

Bây giờ, hãy truyền một danh sách các mục vào mẫu và hiển thị chúng bằng vòng lặp for. Đầu tiên, hãy sửa đổi chế độ xem:

def home(request):
    context = {
        'message': 'Welcome to my website!',
        'items': ['Item 1', 'Item 2', 'Item 3']
    }
    return render(request, 'home.html', context)

Bây giờ, trong mẫu, sử dụng vòng lặp for để hiển thị từng mục:

<ul>
{% for item in items %}
    <li>{{ item }}</li>
{% endfor %}
</ul>

Thao tác này sẽ hiển thị danh sách các mục không theo thứ tự: Mục 1, Mục 2 và Mục 3.

Kế thừa mẫu cho các bố cục có thể tái sử dụng

Django cho phép bạn sử dụng kế thừa mẫu để tạo một bố cục chung có thể được sử dụng lại trên nhiều trang. Ví dụ, hãy tạo một mẫu cơ sở chứa cấu trúc trang HTML của bạn:

<!-- base.html -->
<html>
    <head>
        <title>My Website</title>
    </head>
    <body>
        <header>
            <h1>My Website</h1>
        </header>
        
        <main>
            {% block content %}{% endblock %}
        </main>

        <footer>
            <p>Footer content here</p>
        </footer>
    </body>
</html>

Bây giờ, trong mẫu "home.html" của bạn, hãy mở rộng mẫu cơ sở và xác định khối nội dung:

<!-- home.html -->
{% extends 'base.html' %}

{% block content %}
    <h2>Welcome to the Home Page</h2>
    <p>This is the dynamic content of the home page.</p>
{% endblock %}

Khi được hiển thị, nội dung "home.html" sẽ được chèn vào phần {% block content %}{% endblock %} của mẫu cơ sở.

Phần kết luận

Chúng tôi đã học cách xây dựng các chế độ xem và mẫu động trong Django. Bằng cách truyền dữ liệu từ chế độ xem đến các mẫu và sử dụng các thẻ mẫu mạnh mẽ của Django, bạn có thể tạo các trang web phong phú và tương tác. Ngoài ra, kế thừa mẫu cho phép bạn sử dụng lại các bố cục chung trên toàn bộ ứng dụng của mình, giúp mã của bạn dễ bảo trì hơn.

Với những khái niệm này, bạn có thể bắt đầu xây dựng các ứng dụng Django phức tạp hơn và tận dụng toàn bộ sức mạnh của framework này.

django chế độ xem mẫu động html python ngữ cảnh kết xuất nếu cho vòng lặp người dùng xác thực kế thừa