Vue 계산 속성에서 화살표 함수가 예상대로 작동하지 않는 이유는 무엇입니까?

Vue 계산 속성의 화살표 함수

문제:

Vue 계산 속성에서 화살표 함수 사용 속성으로 인해 예기치 않은 동작이 발생할 수 있습니다. 계산된 속성의 메서드를 화살표 함수로 변경한 후에도 기본 데이터 값이 여전히 성공적으로 전환되더라도 DOM 요소의 색상은 변경되지 않습니다.

답변:

이 문제는 화살표 함수가 이를 계산된 속성이 정의된 Vue 인스턴스에 바인딩하지 않기 때문에 발생합니다. 이 동작은 인스턴스 메서드와 같이 화살표 함수가 사용되는 다른 컨텍스트와 일치합니다.

Vue 문서에 따라:

"인스턴스 속성이나 콜백에 화살표 함수를 사용하지 마세요. (예: vm.$watch('a', newVal => this.myMethod())) 화살표 함수는 상위 컨텍스트에 바인딩되므로 이는 Vue 인스턴스가 아닙니다. 예상할 수 있듯이 this.myMethod()는 정의되지 않습니다."

해결 방법:

이 문제를 해결하려면 계산된 속성이나 인스턴스 메서드에서 화살표 함수를 사용하지 마세요. . 대신, 전통적인 함수 구문(예: function() { ... })을 사용하여 이를 Vue 인스턴스에 올바르게 바인딩하세요.

위 내용은 Vue 계산 속성에서 화살표 함수가 예상대로 작동하지 않는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!