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

Question

我必须运行一个具有强制变量的查询，该变量是另一个查询的结果。因为这样的结果可以是 number | undefined，typescript 提示说我的变量只能是一个number 但不是 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
})

Answer 1

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

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

希望对您有所帮助!