Julia Sememova
Feb 8, 20221 min
Отслеживайте свои задачи с помощью списка дел. Вы можете создать чек-лист для себя, своих сотрудников или клиентов.
В этом примере мы позволяем посетителям сайта отслеживать свои задачи с помощью списка дел. Посетители могут добавлять задачи в список, отмечать задачи как выполненные и удалять выполненные задачи.
Мы создали коллекцию MyTasks со следующими полями:
Заголовок: название задачи
isComplete: указывает, завершена ли задача
Для простоты работы, на данный момент любой пользователь может изменять данные коллекции, но при использовании этого примера на вашем сайте всегда предпочтительнее предоставлять только необходимые разрешения для доступа к вашей коллекции.
На нашей главной индексной странице мы добавили следующие элементы:
TextInput: для ввода текста для новой задачи.
Кнопка: для добавления новой задачи в список.
Repeater: для отображения текущих задач. Каждый элемент содержит текстовый элемент, содержащий название задачи, и кнопку для отметки задачи как выполненной.
Кнопка: для удаления всех выполненных задач из списка.
Мы обрабатываем все операции, связанные с коллекцией, в веб-модуле data.jsw. Веб-модуль включает в себя функции для получения всех текущих задач, вставки новой задачи, обновления задачи и удаления задачи. Мы рекомендуем использовать внутренний код при доступе к коллекции из соображений безопасности.
Мы зарегистрировали следующие обработчики событий:
onItemReady: запускается для каждой задачи, показанной в повторителе. Для каждой задачи нам нужно показать ее как выполненную или незавершенную, в соответствии с ее статусом, и зарегистрировать соответствующий переключатель в обработчике события changeCompletedStatus.
createNewTask: выполняется либо при нажатии кнопки «Добавить», либо при нажатии клавиши «Ввод», когда фокус находится на элементе TextInput.
clearCompletedTasks: запускается при нажатии кнопки Clear Completed.
Мы вызываем fetchData(), которая заполняет повторитель задачами, хранящимися в коллекции. Во время выполнения операции отображается gif-файл загрузчика.