source

Vue - 이 기능을 사용하거나 액세스할 수 없습니다.mixin 파일의 $120 또는 vue 인스턴스

factcode 2022. 8. 25. 23:47
반응형

Vue - 이 기능을 사용하거나 액세스할 수 없습니다.mixin 파일의 $120 또는 vue 인스턴스

src/mixins/chechauthMixin.js 파일은 다음과 같습니다.

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

그런데 여기서 'this'라는 단어는 정의되지 않은 것 같아요.컴포넌트 또는 my routes.js 파일에서 이 mixin 메서드를 호출합니다.vue 인스턴스에 액세스하려면 어떻게 해야 합니까?이것이 불가능할 경우 이러한 시나리오에 대한 적절한 회피책은 무엇입니까?

소셜 인증 기능을 저장하는 유사한 믹스인 파일이 있으며, 이 파일도 'this' 인스턴스를 사용합니다.콘솔에서 인스턴스를 디버깅하여 사용하려고 하면 요소가 정의되어 있지 않음을 나타냅니다.단, 디버깅을 하지 않으면 인증코드는 정상적으로 동작합니다.

두 시나리오에서 정확히 무슨 일이 일어나고 있나요?

내 생각엔 네가 예전 자바스크립트 콜을 사용하고 있기 때문인 것 같아

 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')
          }   
      }
   }
}

저도 믹스인을 사용하고 있기 때문에 문제 없습니다.$140...새로운 구문을 사용하여 믹스인을 작성합니다.이것으로 당신의 문제가 해결되기를 바랍니다.

그래, 그래서 내가 그 문제를 알아냈다고 생각해 봐.사실 믹스인을 잘못 사용하고 있어요.믹스인은 유사한 기능을 공유하는 여러 컴포넌트에 사용됩니다.저는 믹스인을 스탠드아론 기능으로 사용하려고 했습니다.

내가 실제로 사용하고 싶었던 것은 도로 경비대였다.vue-router에는 beforeach라는 기능이 있습니다.이 기능을 사용하고 싶었지만 이 문제에 직면했을 때는 몰랐습니다.

한다면this네가 기대했던 게 아니야, 해봐self:

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

스택 오버플로에 오신 것을 환영합니다.다음 번에는 코드와 질문을 가능한 한 간결하게 하도록 하세요."텍스트의 벽"(여러분이 가지고 있는 여러 단락의 분류)은 질문에 빠르게 대답하기 어렵게 하기 때문에, 질문에 대한 답변은 그렇지 않은 경우만큼 빠르게 대답하거나 전혀 대답하지 못합니다.이 사이트의 사람들이 당신의 질문을 이해하는 데 시간을 들이지 않도록 양심적으로 행동하세요. 그래야 그들이 질문을 건너뛸 수 있습니다.

또한 시도한 내용과 발생한 오류를 추가합니다.행운을 빕니다.

언급URL : https://stackoverflow.com/questions/55045293/vue-can-not-use-or-access-this-router-or-vue-instance-in-my-mixin-file

반응형