vue-无法使用或访问此.我的Mixin文件中的$路由器或VUE实例

Question

我的src/mixins/chechauthmixin.js文件如下：

export const checkauthMixin = {
    methods: {
        validateAuthentication: function(path) {
            if(this.$store.getters.isAuthenticated) {
                this.$router.push('/dashboard')
            }   
        }
    }
}

但是，这里似乎"这个"一词在这里不确定。我正在从组件或我的路由文件中调用此Mixin方法。如何访问VUE实例？如果这是不可能的，那么对于这种情况来说，什么是好的解决方法？

我有一个类似的混音文件，我可以在其中存储我的社交身份验证功能，并且也使用了"此"实例。当我调试并尝试在控制台中使用实例时，它指出该元素是未定义的。但是，我的身份验证代码能够正常工作，否则我不进行调试。

在两种情况下发生了什么？

Answer 1

我认为这是因为您正在使用旧的JavaScript调用

 validateAuthentication: function(path) {
        if(this.$store.getters.isAuthenticated) {
            this.$router.push('/dashboard')
        }   
    }

尝试使用：

export const checkauthMixin = {
   methods: {
      validateAuthentication(path) {
          if(this.$store.getters.isAuthenticated) {
             this.$router.push('/dashboard')
          }   
      }
   }
}

我也使用Mixins，并且使用此方法没有问题。$路由器...但是我用较新的语法编写Mixins。希望这能解决您的问题

Answer 2

好的，所以我想我弄清楚了这个问题。我实际上使用混合蛋白不正确。混合蛋白应该用于具有类似功能的多个组件。我试图将Mixin用作独立函数。

我实际想使用的是一个顾客。因此，vue-router具有一个称为beforeach的函数，这就是我想使用的，但在我面对这个问题时不知道。

Answer 3

如果this不是您的期望，请尝试self：

validateAuthentication: function(path) {
    var self = this;
    if(self.$store.getters.isAuthenticated) {
        self.$router.push('/dashboard')
    }   
}

---

欢迎来到堆栈溢出。下次，尝试使您的代码和提问尽可能简洁。"文字墙"（您拥有的杂乱无章的段落）使您的问题很难迅速回答，因此不会像以前那样快速回答，或者完全回答。认真对此网站上的人们不想花时间理解您的问题，因此他们会跳过它。

另外，请务必添加您尝试过的内容以及您遇到的错误。祝你好运！