Всем привет.
Делаю todo-шку. Слева колонка, при нажатие на синюю кнопку, создаются списки задач, вот в таком виде -> инпут: кнопка открытия: кнопка удаления. Вопрос:
Как сделать так, чтобы при нажатии на "кнопка открытия", справа отображалось содержимое данного списка и при нажатии на другой список, содержимое прошлого закрывается и отображается нынешнее? Куда копать, что почитать/посмотреть?
на кнопке открытия вешаешь еще и закрытие другого списка или проверку на то открыт ли список и закрытие его.
Решение в лоб -> у тебя где то должна быть переменная флаг которая отвечает за открытие и закрытие.
Клик на кнопке -> переменная становиться true и спискук добавляется класс на открытие.
как то так
Имхо, проще сразу пытаться завязаться на History API и рендерить в соответствии с изменением URL. Примитивный роутер сделать не очень сложно, а пользы он принесёт намного больше, чем жонглирование глобалами.
Алексей Уколов, я правильно понял, что вы предлагаете с помощью History api переходить по созданным спискам как по новым страницам, без перезагрузки, т.е. использовать историю текущей сессии (вкладки) браузера? Если так, то я не понимаю, чем должны быть в таком случае списки, которые создаются по кнопке?
Если к примеру брать какой нибудь SPA (в этом я тоже не силен, отталкиваюсь от того, что прочитал), то у него динамический контент подгружается с сервера, на котором уже есть этот самый контент, т.е. уже созданы html-файлы, которые подгружаются на сайт без перезагрузки страницы.
Но как быть в моем случае, если нет никаких других html-файлов, а списки создаются на ходу, по нажатию кнопки? Тогда как я смогу переходить по ним в соответствии изменения URL?
Роман Валеев, списки у вас всё равно где-то хранятся. Самое простое, с чего вы начнёте - это глобальная переменная в памяти. Вот оттуда берите их и рендерите, когда при помощи стандартных событий определяете, что URL страницы изменился.
Егор П, когда в глобальной переменной хранятся данные - это нормально для начала. Когда в глобальной переменной хранится состояние роутинга - это не очень.
Роман Валеев, вот эти синие иконки, по которым открывается форма создания, будут у вас кнопками-ссылками и вы по клику будете менять URL. Это будет единственная обязанность этих кнопок. Единственной обязанностью конкретного интерфейса добавления будет добавление. А единственной обязанностью вашего самописного роутера будет рендерить нужную страницу в ответ на изменение URL. Таким образом ваше приложение будет проще создавать и дорабатывать. Но это потребует погружения и экспериментов с тем, что я описываю. Но поскольку почти весь современный сложный фронтенд работает примерно так, это время не будет потрачено зря :)
Что касается событий - прочитайте любую статью Getting Started with History API, там будет подробно описано :)
