Vue 3 组合 api - 计算属性返回未定义

Question

使用 Vue 3 组合 API，如何返回属性的计算值firstDigit？this计算属性中的关键字是，undefined但是当我省略时this，我会收到错误fourDigits is not defined。

<script setup>
import { computed, reactive } from 'vue'

const input = reactive({
    fourDigits: Array(1,2,3,4),
    firstDigit: computed(() => {
      return this.fourDigits[0] <===== `this` is undefined but if I leave `this` out, then `fourDigits` is undefined.
    })
</script>

<template>
   <div>
     <pre>
       {{JSON.stringify(input.firstDigit, null, 2)}}
     </pre>
   </div>
</template>

Answer 1

this是组合 API 中的其他内容，请尝试使用：

firstDigit: computed(() => {
  return input.fourDigits[0] 
})