Ключи, которые читает скрипт

Часть раздела JSON API путешествия по Django на Coddy. Урок 13 из 19.

Новый app.js добавляет над списком сводку, сформированную на основе /api/stats/. Скрипт и ваша часть на Django взаимодействуют через имена: идентификаторы, которые он ищет на странице, и ключи, которые он считывает из JSON.

const stats = await response.json();
summary.textContent = stats.open + " open, " + stats.done + " done";

stats.done считывает ключ "done" из вашего JSON. Если в JSON нет ключа, ошибка не возникает: JavaScript считывает его как undefined и выводит это слово на странице. Отсутствующий идентификатор тоже не вызывает явного сбоя — ошибка появляется только в консоли браузера. Поэтому сначала прочитайте скрипт: его имена определяют ваши, вплоть до каждой буквы.

Задание

Средне

Прочитай новый app.js, а затем добавь то, что ему нужно:

На главной странице — абзац со сводкой и идентификатором, который ищет скрипт, выше тега script.
В /api/stats/ — ключ для задач, которые ещё не выполнены и который читает сводка, рядом с total и done.

Нажми «Run»: в сводке отображается 2 open, 1 done.

Попробуйте сами

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Task tracker</title>
</head>
<body>
    <h1>Task tracker</h1>
    <ul id="task-list"></ul>
    <script src="{% static 'tasks/app.js' %}"></script>
</body>
</html>