5 Vuex плагинов которые вы можете использовать в своем следующем Vue.js проекте

Перевод статьи 5 Vuex Plugins For Your Next VueJS Project

На данный момент существует огромное количество причин использовать Vuex что бы управлять состоянием своего Vue.js приложения. Одной из таких причин является возможность добавлять реально очень крутые штуки с помощью плагинов для Vuex. Разработчики состоящие во Vuex сообществе придумали и реализовали просто тонну всяких плагинов что бы вы использовали их прямо сейчас. Большинство из этих плагинов предлагают нам функционал который мы и представить не могли.

В этой статье, я покажу вам 5 интересных вещей которые вы сможете использовать в своем следующем проекте с Vuex.

  • Сохранение состояния приложения
  • Синхронизация информации между вкладками/окнами
  • Локализация приложения
  • Управление несколькими состояниями загрузки
  • Кэширование экшенов

vuex-persistedstate использует local storage что бы сохранить состояние вашего приложения между сессиями. Это значит, что даже после обновления страницы, данные которые вы запомните через vuex-persistedstate не исчезнут.

Например с помощью него можно сделать корзину для вашего интернет-магазина. Пользователь добавил товары, закрыл вкладу, и вернувшись в следующий раз все товары в корзине будут на месте.

vuex-shared-mutations синхронизирует состояние приложения между вкладками браузера. Это происходит за счет сохранения мутаций в local storage вашего браузера. Триггеры событий в хранилище запускают повторение сохраненных мутаций, что позволяет синхронизировать состояние вашего приложения между вкладками браузера.

vuex-i18n позволит вам хранить контент сразу на нескольких языках, и очень удобно, а главное быстро переключаться между языковыми версиями вашего приложения.

Одной очень крутой фишкой является возможность хранить строки сразу заглушками. Например “Привет {name}, это твое Vue.js приложение”. Все варианты перевода этих строк будут содержать данную заглушку в том же самом месте.

vuex-loading помогает управлять сразу несколькими состояниями загрузки в вашем приложении. Этот плагин очень удобен для realtime-приложений, постоянные обновления и загрузки в которых происходят достаточно часто.

vuex-cache может кэшировать ваши экшены Vuex. Например, если вы получаете данные с сервера, этот плагин будет кэшировать результат при первом вызове экшена, а затем вернет кешированное значение при последующих запросах. Если необходимо, то просто очистите кеш.

Буду очень рад если вы расскажете о других интересных Vuex плагинах в комментариях.

P. S.: это мой первый перевод, так что критика приветствуется ;)

Владимир Бандуристов

Written by

Занимаюсь созданием бизнес-сайтов, интернет-магазинов, корпоративных сайтов, версткой, доработкой сайтов, их наполнением и продвижением.