Question

我已经设置了Vue原型

Vue.prototype.$preventAccess = function (role ) {

if(role === this.$store.state.role) {
// do some stuff

}

}

这是我的主要入口，但是当我尝试在外部模块（prevent.js）中使用它时

import store from '@store/store';
import Vue from 'vue';

export default function log({ next, to }) {
  console.log(Vue.prototype.$preventAccess('Editor'));
}

我收到错误

Cannot read property 'state' of undefined

我不能在这样的外部JS文件中使用我的原型吗？如何将商店注入到外部模块中？

Answer 1

按照此处的文档进行操作： https://vuejs.org/v2/guide/plugins.html

MyPlugin.install = function (Vue, options) {

  // 4. add an instance method
  Vue.prototype.$preventAccess = function (role) {
    // some logic ...
  }
}

Vue.use(MyPlugin);

Answer 2

使用prototype时，基于该this创建对象时，您可以访问class。

访问Vue.prototype.$preventAccess时没有this，因为没有Vue的实例，所以也没有创建this。

如果实例化Vue并在该实例上调用$preventAccess，您的呼叫将起作用。

var app = new Vue({
   el: "#app",
})
app.$preventAccess()

现在，$preventAccess定义了this。

外部JS文件中的Vue原型并访问vuex $ store

2 个答案: