"this"는 vue.js 워처에 정의되어 있지 않습니다.

"this"는 vue.js 워처에 정의되어 있지 않습니다.

감시자와 컴포넌트가 있습니다.

props: {
    propShow: { required: true, type: Boolean }
},

data() {
    return {
        show: this.propShow
    }
},

watch: {
    propShow: {
        handler: (val, oldVal) => {
            this.show = val;
        }
    }
}

언제든지parent컴포넌트 변경propShow이 컴포넌트는 컴포넌트의show소유물. This컴포넌트도 변경합니다.show그래서 둘 다 필요한 거야show그리고.propShowVue.js에서는 속성을 직접 변경할 수 없기 때문입니다.

이 행

this.show = val;

에러의 원인

TypeError: Cannot set property 'show' of undefined

왜냐면this내부 핸들러는undefined.

왜요?

를 사용해야 합니다.function다음 문서에서 경고한 바와 같이 구문:

화살표 함수를 사용하여 워처를 정의하지 마십시오(예: searchQuery: newValue => this.update).자동 완성(newValue).그 이유는 화살표 함수가 부모 콘텍스트를 바인드하기 때문에 이것은 예상대로 Vue 인스턴스와 this.update가 아닙니다.자동 완성은 정의되지 않습니다.

따라서 코드는 다음과 같습니다.

watch: {
    propShow: {
        handler: function(val, oldVal) {
            this.show = val;
        }
    }
}

"function"은 es6 코드가 아닙니다.다음 사항을 기입해 주십시오.

watch: {
    propShow: {
        handler(val, oldVal) {
            this.show = val;
        }
    }
}

언급URL : https://stackoverflow.com/questions/42242682/this-is-undefined-in-vue-js-watcher