IT이야기

vuejs 구성 요소에서 생성된 후크에서 메서드 호출

cyworld 2022. 5. 14. 22:33
반응형

vuejs 구성 요소에서 생성된 후크에서 메서드 호출

다음 (부분) 코드를 가진 구성 요소가 있다.

export default {

  methods: {
    mymethod: (x) => {alert(x)},
  },

  created: () => {
    this.mymethod('success');
  },

그리고 나는 다음 오류를 받고 있다.

vue.esm.js?efeb:578 [Vue warn]: Error in created hook: "TypeError: Cannot read property 'mymethod' of undefined"

구성 요소의 vue 인스턴스에 대해 "이것"이 평가되지 않는 것처럼 보일 수 있다.그리고 아이디어는 이것을 어떻게 할 수 있을까?

Vue 메서드, 수명 주기 메서드, 계산된 속성 등을 정의할 때는 화살표 기능을 사용하지 않는 것이 좋으며, 그런 식으로 하면 우선시되기 때문이다.this부에 스스로 밀려서.다음을 시도해 보십시오.

export default {
  methods: {
    mymethod (x) { alert(x) },
  },
  created () {
    this.mymethod('success');
  },
  ...
}

생성된 후크에 화살표 기능을 사용하셨습니다.사용 시도

created: function {
   this.mymethod('success');
},

vue.js 설명서에도 명확하게 나와 있는 경우

() => console.log(the.a) 또는 vm과 같은 옵션 속성이나 콜백에는 화살표 기능을 사용하지 마십시오.$watch('a'), newValue => this.myMethod().화살표 함수는 상위 컨텍스트에 바인딩되어 있으므로, 이것은 예상대로 Vue 인스턴스가 아닐 것이며, Uncaused TypeError: Undefined TypeError 또는 Uncaused TypeError: this.myMethod는 함수가 아니다.

먼저 후크 방법을 다음으로 변경하십시오.

methods: {
  mymethod(x){alert(x);}
}

그런 다음 생성된 후크 함수 내부에서 호출된 메서드도 변경하십시오.이 모양은 다음과 같아야 한다.

created(){
  this.mymethod('success');
}

그럼 넌 끝장이야!

참조URL: https://stackoverflow.com/questions/49872236/calling-a-method-from-created-hook-in-vuejs-component

반응형