vue 디텍터 watch 를 해결 하고 this 를 호출 할 때 undefined 문제 가 발생 합 니 다.

watch 디텍터 에서 새로운 값 을 this.a 에 부여 하 는 중 오류 가 발생 했 습 니 다.

watch: {
 value: (newV, oldV) => {
 this.a = newV;
 }
}

여기 서 undefined 를 잘못 보 고 했 습 니 다.여기 서 잘못된 이 유 는 화살표 함수 로 쓸 수 없 기 때 문 입 니 다.화살표 함수 로 쓰 면 this 는 구성 요소 의 this 가 아 닌 컨 텍스트 를 가 져 옵 니 다.올 바른 쓰기 방법 은:

watch: {
 value: function(newV, oldV) {
 this.a = newV;
 }
}

다음 그림:

시험 링크:https://cn.vuejs.org/v2/api/#watch
PS:알 겠 습 니 다.문 제 는 해결 할 수 있 지만 구체 적 으로 왜 화살표 함수 로 쓰 지 못 하 는 지 솔직히 저도 잘 모 르 겠 습 니 다.원 리 를 아 는 사람 은 저 에 게 댓 글 을 달 아 주 셔 서 감사합니다.
yyf 994 댓 글 답변:

var app = new Vue({
   el: '#app',
   data: {
    a: 1
   },
 
   watch: {
    a:()=> {
     console.log(this)
    }
   },
 
   methods: {
    onClick() {
     this.a++;
    }
   } 
  })

babel 컴 파일 후에 이렇게 됐어 요.

"use strict"; 
var _this = void 0; 
var app = new Vue({
 el: '#app',
 data: {
 a: 1
 },
 watch: {
 a: function a() {
  console.log(_this);
 }
 },
 methods: {
 onClick: function onClick() {
  this.a++;
 }
 }
});

화살표 함수 의 함수 내 this 대상 은 사용 할 때 있 는 대상 이 아니 라 정의 할 때 있 는 대상 이기 때 문 입 니 다.
vue watch 사용법 과 반응 이 없 는 이유=>아래 watch 가 하나 더 있 는 지 확인
긴 말 안 할 게 요.그냥 코드 보 세 요~

watch: { 
 stop: function(newVal, old){ // josn  
   console.log(newVal)
  },
 'form.fdnDct': function(newVal, old){ //josn  
   console.log(newVal)
  },
 }

 //       
 watch: {
  'browse_integral_info.buy':'RMB',     //          
  'browse_integral_info.give':'GIVE',     //          
  'bargain_integral_info.give':'BARGAINGIVE',
  deep:true,
 },
 methods: {
  RMB: function(){ 
   this.RMBs = this.browse_integral_info.buy/100
  },
 },

이상 vue 디텍터 watch 를 해결 합 니 다.this 를 호출 할 때 undefined 문제 가 발생 한 것 은 바로 편집장 이 여러분 에 게 공유 한 모든 내용 입 니 다.참고 가 되 었 으 면 좋 겠 습 니 다.여러분 들 도 많이 응원 해 주 셨 으 면 좋 겠 습 니 다.