at0m1x
@at0m1x

Как подключить один плагин два раза но с разными настройками?

Есть плагин vue2-storage позволяющий использовать браузерный localStorage.

В настройках этого плагина можно указывать префикс, который будет использоваться для ключей.

В моем Vue2 приложении нужно хранить в localStorage два вида данных: пользователи и автомобили. Эти данные между собой никак не связаны и пересекаться не должны.

Пользователи - это список логинов как ключей и данные их профилей как значения:
evan {name: 'Evan', 'email': 'evan@mail.com'}
piter {name: 'Piter', 'email': 'piter@mail.com'}
eva {name: 'Eva', 'email': 'eva@mail.com'}
...


Автомобили - это список номеров авто как ключей и их характеристики как значения:
А111АА11 {brand: 'Volkswagen', 'model': 'Polo', 'year': 2015, hp: 150}
А222АА22 {brand: 'BMW', 'model': 'X3', 'year': 2017, hp: 170}
А333АА33 {brand: 'Lada', 'model': 'Priora', 'year': 2008, hp: 98}
...


Можно ли сделать что-то вроде этого:
import Vue from 'vue';
import { Plugin } from 'vue2-storage';
Vue.use(Plugin, {prefix: 'users_'});
Vue.use(Plugin, {prefix: 'cars_'});

// И далее используем как то так:
this.$usersStorage.set(...);
this.$carsStorage.set(...);
...


Конечно код указанный выше не будет работать, потому что Vue не позволяет подключить два одинаковых плагина. Или как то все-таки позволяет?

Возможно есть какой-то обходной путь, в виде создания какого-то рода своих оберток над методами этого плагина?

Или вовсе создать два своих плагина, которые будут наследоваться от vue2-storage, но хранить себя во Vue приложении не просто как this.$storage, а как this.$usersStorage и this.$carsStorage?

Понимаю что хранения JSON объектов в localStorage это не совсем верный подход, и для этого более подходящий вариант возможно IndexedDB. Но данных будет очень мало, всего около 10 записей, и использовать для них более развесистый IndexedDB не очень хочется.
  • Вопрос задан
  • 76 просмотров
Решения вопроса 1
at0m1x
@at0m1x Автор вопроса
Немного не по сути вопроса, но для решения задачи хорошо подошли Vuex + vuex-persistedstate.
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
yarkov
@yarkov Куратор тега Vue.js
Помог ответ? Отметь решением.
Весьма неожиданно увидеть на Тостере вопрос, который касается моего пакета ))

Конечно код указанный выше не будет работать, потому что Vue не позволяет подключить два одинаковых плагина. Или как то все-таки позволяет?

Совершенно верно, дважды установить плагин не получится ))
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы