Kunci yang Dibaca Skrip

Termasuk bagian API JSON dalam perjalanan Django di Coddy. Pelajaran 13 dari 19.

app.js yang baru menambahkan ringkasan di atas daftar, yang dibuat dari /api/stats/. Skrip dan sisi Django-mu bertemu pada nama: id yang dicari skrip di halaman dan kunci yang dibacanya dari JSON.

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

stats.done membaca kunci "done" dari JSON-mu. Kunci yang tidak ada di JSON tidak menimbulkan error: JavaScript membacanya sebagai undefined dan menampilkan kata itu di halaman. id yang tidak ditemukan juga gagal tanpa terlihat, hanya dengan error di konsol browser. Jadi, baca skripnya terlebih dahulu: nama-nama di dalamnya menentukan namamu, huruf demi huruf.

Tantangan

Sedang

Baca app.js yang baru, lalu berikan yang dibutuhkannya:

Di halaman beranda, paragraf ringkasan dengan id yang dicari skrip, di atas tag skrip.
Di /api/stats/, tambahkan kunci yang dibaca ringkasan untuk tugas yang belum selesai, di samping total dan done.

Tekan Jalankan: ringkasan menampilkan 2 open, 1 done.

Coba sendiri

{% 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>