Menu
CoddyTech

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

Часть раздела 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 и выводит это слово на странице. Отсутствующий идентификатор приводит к такому же тихому сбою — ошибка появляется только в консоли браузера. Поэтому сначала прочитайте скрипт: именно его названия определяют ваши — буква в букву.

challenge icon

Задание

Средне

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

  1. В файле tasks/templates/tasks/home.html добавь абзац со сводкой и идентификатором, который ищет скрипт, выше тега script.
  2. Во представлении stats в файле tasks/views.py добавь ключ, который считывает сводка (найди его после stats. в файле app.js). Его значение — число невыполненных задач.

Нажми «Запустить»: в сводке отображается 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>

Все уроки раздела JSON API

Потренируйтесь самостоятельно: Песочница Django