如何在该计算属性方法中读取计算属性的当前值？

Question

我们希望在字符串超过 3 个字符时启用查询。启用查询后，它应该保持启用状态。使用 Vue 2 组合 API，我们创建了一个带有查询状态的 reactive 对象：

import { computed, defineComponent, reactive, ref } from '@vue/composition-api'

export default defineComponent({
  setup() {
    const truckId = ref<string>('')
    const driverId = ref<string>('')

    const queryEnabled = reactive({
      driver: false,
      truck: false,
    })

现在将queryEnabled.driver 的值设置为true，当driverId 是一个长度超过3 个字符的字符串时，我们可以这样做：

    const queryEnabled = reactive({
      driver: computed(() => driverId.value.length >= 3),
      truck: false,
    })

这可行，但一旦字符串的字符较少，它也会将queryEnabled.driver设置为false。我们怎样才能拥有一个computed 属性：

• 以false 开头
• 一旦满足条件，将值设置为true
• 将值保留为 true

这可以在reactive 对象中的一个computed 属性中完成吗？我正在考虑使用function 而不是粗箭头来访问当前computed 属性的this，但无法弄清楚。

Answer 1

您无法从自身内部访问computed 属性，因此请使用watch 根据driverId 更新状态：

import { watch, defineComponent, reactive, ref } from '@vue/composition-api'

export default defineComponent({
  setup() {
    const truckId = ref<string>('')
    const driverId = ref<string>('')

    const queryEnabled = reactive({
      driver: false,
      truck: false,
    })

    watch(driverId,(newVal)=>{
      if(!queryEnabled.driver && newVal.length >= 3){
        queryEnabled.driver = true
      }
    })