Как использовать плагин Vue в магазине? - PullRequest
Новая
       16

Как использовать плагин Vue в магазине?

0 голосов
/ 25 октября 2018

Есть ли правильный / документированный способ использования плагина внутри модуля vuex или простого модуля js?Я использую шину событий, чтобы добиться этого, не уверен, что это правильный / лучший способ.Пожалуйста, помогите.

Plugin1.plugin.js: 

const Plugin1 = {
  install(Vue, options) {
    Vue.mixin({
      methods: {
        plugin1method(key, placeholderValues = []) {
          return key;
        },
      },
    });
  },
};

export default Plugin1;

В App.vue: 

Vue.use(Plugin1, { messages: this.plugin1data });

В магазине / plain-js модуль: 

const vue = new Vue();
const plugin1method = vue.plugin1method;

1 Ответ

0 голосов
/ 26 октября 2018

вы можете получить доступ к своему экземпляру Vue , используя this._vm;
и Vue global , используя import Vue from 'vue';, а затем Vue;

. ЯПолагаю, вы определили метод экземпляра, поэтому это будет первый (this._vm.plugin1method())

update

Я не могу сказать вам, каким образом вы должныиспользуйте его, потому что я не вижу, как ваша функция определяется в вашем плагине.

Однако это пример, который должен иллюстрировать разницу между экземпляром и глобальным 

const myPlugin = {
  install: function(Vue, options) {
    // 1. add global method or property
    Vue.myGlobalMethod = function() {
      // something logic ...
      console.log("run myGlobalMethod");
    };
    Vue.mixin({
      methods: {
        plugin1method(key, placeholderValues = []) {
          console.log("run mixin method");
          return key;
        }
      }
    });
    // 4. add an instance method
    Vue.prototype.$myMethod = function(methodOptions) {
      console.log("run MyMethod");
      // something logic ...
    };
  }
};

Vue.use(Vuex);
Vue.use(myPlugin);

const store = new Vuex.Store({
  state: {
    count: 0
  },
  mutations: {
    increment(state) {
      this._vm.$myMethod();
      Vue.myGlobalMethod();
      this._vm.$options.methods.plugin1method();  // <-- plugin mixin custom method
      state.count++;
    }
  }
});

, когда вы фиксируетеприращение, т.е.: this.$store.commit('increment') оба метода будут выполняться

...