계산 된 속성 Vue.js에서 데이터에 액세스하는 방법

Question

Vue.js를 사용하고 있으며 계산 된 속성의 데이터에서 변수에 액세스하려고하면 undefined을 반환합니다.

<script> 
    export default { 
     name: 'app', 
     data:() => { 
     return { 
      lang: 'sp' 
     } 
     }, 
     computed: { 
     langEn:() => this.lang === 'en', 
     langSp:() => this.lang === 'sp' 
     } 
    } 
    </script> 

이것은 NPM 프로젝트에 있습니다 여기에 코드입니다. 그리고 .vue 파일 내부. 이런 식으로 사용하면 다르게 동작할까요? 도움

Answer 1

에 대한

감사합니다 이것은 매우 일반적인 실수이다.

계산할 때 굵은 화살표를 사용하지 마십시오.

굵은 화살표를 사용하여 계산 된 데이터, 메서드 또는 데이터를 정의 할 때 this을 어휘로 캡처하면 Vue가 아니라 window을 가리키게됩니다.

<script> 
export default { 
    name: 'app', 
    data() { 
    return { 
     lang: 'sp' 
    } 
    }, 
    computed: { 
    langEn(){return this.lang === 'en'}, 
    langSp(){return this.lang === 'sp'} 
    } 
} 
</script>