如何在相关组件上生成Vue插件函数调用方法?

对于staters来说,编写“VueInstance”是错误的,因为交给您的是Vue类函数,而不是Vue的实例。

现在回答你的问题,我不太清楚,我想说你需要使用一个状态管理系统。

如果我理解的很好,您希望在Vue原型上创建一个方法,该方法调用组件“Magic”的每个实例的另一个方法部分。 (为什么我要说每一个例子?因为不能从组件的定义中调用方法,所以必须通过实例来访问它的一个方法或数据)。

老实说,这似乎太复杂了,但由于我不知道你的最终目标是什么,这里有一些线索:

1. 您可以创建组件的空实例来访问其方法。

Import Magic from './Magic.vue';

const myMagic = new (Vue.extend(Magic));

export default {
  install(VueInstance) {
    console.log('Installing');

    VueInstance.component('magic', Magic);
    VueInstance.prototype.$magic = {
      increment() {
        myMagic.method()
      }
    };
  }
};

从理论上讲,您的Magic组件的所有实例都将具有相同的方法,因此这是可行的,但是,这不会改变您所有实例的状态,在这里您只需要访问该方法(因此我没有看到用例,服务/实用程序会更好,请参见#2)

共享.js

export const state = {
  somedata: 0
};

export const methods = {
  inc() {
    state.somedata++
  }
};

import { state, methods}  from './Shared.js'

export default {
  data() {
    return {
      shared: state
    }
  },
  methods: {
    Something () {
      methods.inc();
    }
  }
};

插件.js

import { state, methods}  from './Shared.js'
import Magic from './Magic.vue';

export default {
  install(VueInstance) {
    console.log('Installing');

    VueInstance.component('magic', Magic);
    VueInstance.prototype.$magic = {
      increment() {
        methods.inc()
      }
    };
  }
};

在全局范围内,您可以通过这种方式共享它(它是被动的,因为a将对象引用给了Magic component数据,该数据将是每个实例的sae引用,因此共享)。

3. 做#2但使用vuex与状态和突变或行动。