В предыдущих уроках вы узнали, как создать приложение блога с использованием представлений на основе функций.
Введение в представления, основанные на классах
Представления на основе функций просты, но гибки. В более ранних версиях Django поддерживал только представления на основе функций. Позже Django добавил поддержку представлений на основе классов, которые позволяют определять представления с помощью классов.
Представления на основе классов являются альтернативным способом реализации представлений. Они не заменяют представления на основе функций, но имеют некоторые преимущества:
- Организуют код, связанный с методами HTTP, такими как GET и POST, используя отдельные методы, а не условное ветвление в одной и той же функции.
- Используют множественное наследование для создания повторно используемых классов представлений.
В этом уроке вы узнаете, как использовать Django ListView для отображения списка задач для приложения Todo list в Python.
Определение представления на основе классов
Чтобы отобразить список объектов, вы определяете класс, который наследуется от класса ListView. Например, следующий код определяет класс TaskList в views.py приложения todo:
from django.shortcuts import render
from django.views.generic.list import ListView
from .models import Task
class TaskList(ListView):
model = Task
context_object_name="tasks"
# ...
TaskList — это представление на основе класса, которое наследуется от класса ListView. В классе TaskList мы определяем следующие атрибуты:
- model указывает объекты, из которых вы хотите отобразить. В этом примере мы используем модель Task. Внутренне Django запросит все объекты из модели Task(Task.objects.all()) и передаст их в шаблон.
- context_object_name указывает имя переменной списка моделей в шаблоне. По умолчанию Django использует object_list. Однако имя object_list является довольно общим. Поэтому мы переопределяем context_object_name, устанавливая его значение в tasks.
По соглашению класс TaskList загрузит шаблон todo/task_list.html. Имя шаблона соответствует этому соглашению:
app/model_list.html
Если вы хотите задать другое имя, вы можете использовать атрибут template_name. В этом руководстве мы будем использовать имя шаблона по умолчанию, то есть task_list.html.
Определить маршрут
Измените urls.py приложения todo на следующее:
from django.urls import path
from .views import home, TaskList
urlpatterns = [
path('', home, name="home"),
path('tasks/', TaskList.as_view(),name="tasks"),
]
- Как это работает.
Сначала импортируйте класс TaskList из модуля views.py.
from .views import home, TaskList
- Во-вторых, определите задачи/URL, который отображает список задач:
path('tasks/', TaskList.as_view(),name="tasks"),
В этом коде мы сопоставляем URL tasks/ с результатом метода as_view() класса TaskList.
Обратите внимание, что вы можете указать атрибуты класса TaskList в методе as_view(). Например, вы можете передать имя шаблона в метод as_view() следующим образом:
path('tasks/', TaskList.as_view(template_name="mytodo.html"),name="tasks"),
Метод as_view() имеет аргументы, соответствующие атрибутам класса TaskList.
Создание шаблона Django ListView
Определите task_list.html в каталоге templates/todo приложения Todo:
{%extends 'base.html'%}
{%block content%}
<div class="center">
<h2>My Todo List</h2>
{% if tasks %}
<ul class="tasks">
{% for task in tasks %}
<li><a href="#" class="{% if task.completed%}completed{%endif%}">{{ task.title }}</a>
<div class="task-controls">
<a href="#"><i class="bi bi-trash"></i> </a>
<a href="#"><i class="bi bi-pencil-square"></i></a>
</div>
</li>
{% endfor %}
{% else %}
<p>🎉 Yay, you have no pending tasks!</p>
{% endif %}
</ul>
</div>
{%endblock content%}
Шаблон task_list.html расширяет шаблон base.html проекта. В шаблоне task_list.html мы перебираем задачи QuerySet и отображаем каждую из них как элемент списка.
Также, если задача выполнена, мы добавляем завершенный CSS-класс к тегу a. Этот CSS-класс добавит линию-сквозь к элементу.
Если набор запросов задач пуст, мы выводим сообщение об отсутствии ожидающих выполнения задач.
Включение ссылки ListView в базовый шаблон
Измените шаблон base.html, чтобы включить ссылку «My Tasks» в навигацию:
{%load static %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://copython.ru/{% static"css/style.css' %}" />
<title>Todo List</title>
</head>
<body>
<header class="header">
<div class="container">
<a href="{%url 'home'%}" class="logo">Todo</a>
<nav class="nav">
<a href="{%url 'home'%}"><i class="bi bi-house-fill"></i> Home</a>
<a href="{% url 'tasks' %}"><i class="bi bi-list-task"></i> My Tasks</a>
</nav>
</div>
</header>
<main>
<div class="container">
{%block content %}
{%endblock content%}
</div>
</main>
<footer class="footer">
<div class="container">
<p>© Copyright {% now "Y" %} by <a href="https://copython.ru">Python Tutorial</a></p>
</div>
</footer>
</body>
</html>
Если вы откроете URL:
http://128.0.0.1:8000/tasks/
Вы увидите список задач следующим образом:
