时间戳

首页 > 解决方案 > 如果 NOT 可选变量未定义，则跳过查询

reactjs - 如果 NOT 可选变量未定义，则跳过查询

问题描述

我必须运行一个具有强制变量的查询，该变量是另一个查询的结果。由于这样的结果可以是number | undefined，打字稿抱怨说我的变量只能是 anumber而不是 undefined

const { data: firstQueryData } = useQuery(GET_MY_FIRST_QUERY_DATA, {
    variables: {
      firstVariable: 100
    }
  })

const myVariable = myQueryData?.getMyQueryData <-- This is "number" | "undefined"

const { data: secondQueryData } = useQuery(GET_MY_SECOND_QUERY_DATA, {
  variables: {
    secondVariable: myVariable <-- This is "number" | "undefined" while it should only be "number"
  }
})

我尝试使用skip但 TS 仍然抱怨：

const { data: mySecondQuery } = useQuery(GET_MY_SECOND_QUERY_DATA, {
  variables: {
    secondVariable: myVariable
  },
  skip: !myVariable
})

标签： reactjstypescriptapollo-client

解决方案

我有同样的问题并通过首先检查变量的真实性来解决它，例如：

const { data: mySecondQuery } = useQuery(GET_MY_SECOND_QUERY_DATA,
  myVariable
    ? {
        variables: {
          secondVariable: myVariable,
        },
      }
    : { skip: true }
);

希望有帮助！

推荐阅读