如何从计算属性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将从词汇上进行捕获,它将指向包含范围(通常window或未定义)而不是您的Vue.

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