Vuex, как правильней использовать state в приложении с тасками?
Знаю что стор используют для хранения данных которые нужны в более чем одном компоненте. Например аутентификация юзера или тема приложения. Но погуглив реализацию всяких примеров, люди пихают в стейт например целые посты и сохраняют все это в localStorage.
Чтобы понять на практике vuex решил написать приложение аля трелло, с перетаскиваемыми тасками (используя vuedraggable), но исходя из увиденных примеров выходит я должен хранить в сторе массив доски в котором находится еще и колонки с тасками. Это же дофига данных. Плюс учитывая перетаскивание тасков между колонками, все это обновляется.
Объясните, пожалуйста, как правильней поступить в такой задачке?
Была мысль сохранять в сторе только во время сессии, если вышел - очищать стор и выгружать в базу, вошел - подгрузил из базы и снова в стейт. Но что-то мне кажется это не правильно.
А если прикручивать сокеты, чтобы был реайл-тайм, то выходит по любому нужно хранить все в сторе и записывать в localStorage или я чего-то не понимаю.
1. Должно ли сохраняться в каком-то постоянном хранилище изменение статуса задачи сразу после перетаскивания?
2. В сторе должны лежать сами задачи вкупе со статусами как свойством любой задачи, от коих статусов и зависит куда на доске попадет задача. Вы же не хотите сказать, что у Вас всего один god-компонент, в котором ВСЁ сразу и нет других компонентов, которым нужно знать про таски?
Анатолий,
1. Не думал об этом, но можно учесть. Например также как в Трелло, где в сайдбаре приходят уведомления об изменениях в задаче. В этом случае хранить в стейте логично.
2. Конечно хочется научиться обновлять данные нескольких компонентов из общего стора. Но для начала хотел сделать три роута (/gashboard, /board, /task-id) дашбоард с досками, доска с колонками ну и сам таск.
Перетаскиваться будут только таски между колонками, но может и усложню себе задачу и добавлю смену колонок местами через селект у колонки, типо показать до такой-то или после такой-то колонки, чтобы не делать именно перетаскиванием.
Меня просто смущает сам факт хранения всех тасков в localStorage, гипотетически их же может быть сотни в каждой колонке.
А зачем в LocalStorage? Ну ладно бы там хранить что-то промежуточное или кэш некоторый на случай ухода и возвращения пользователя. А почему нельзя сохранять в фоне в настоящее хранилище ремотное реальные изменения в задачах?
Анатолий То есть vuex тут выступает как удаленое хранилище?
Зачем тогда вообще используют LocalStorage например в случае хранения токена аутентификации?
Или я не совсем понимаю Vuex и LocalStorage. Вернее как с ними работать я разобрался, но не понимаю саму идеологию хранения данных.
massef, нет, под удаленным я понимаю какое-то хранилище на бэкэнде/в облаке. Vuex - хранение общего состояния в приложении с поддержкой реактивности. LocalStorage - хранилище (не очень большое) в браузере, которое используется для сохранения параметров сессии, к примеру. Его не надо использовать как основное хранилище задач!
Средний