主对象可能未定义时的双重解构

Question

首先我的问题不是

的重复

看下面的代码——Apollo Client GraphQL

import { gql, useQuery, useMutation } from '@apollo/client';
...
const { loading, error, data } = useQuery(TREATMENTS);

这样写比较好:

   const { loading, error, data : {treatments} } = useQuery(TREATMENTS);

但是，不幸的是我遇到了以下错误：

TypeError: Cannot read property 'treatments' of undefined
TreadDetails
C:/Users/albertly/Downloads/git/individual-claims/src/TreatDetails.tsx:35

  32 | `;
  33 | 
  34 | function TreadDetails(): React.ReactElement {
> 35 |   const { loading, error, data : {treatments} } = useQuery(TREATMENTS);
  36 |  // const [treatments, setTreatments] = useState<Treatment[]>([]);
  37 |   const { state: stateApp, dispatch: dispatchApp } = useContext(AppContext);

我完全理解为什么会这样。

我的问题是：是否有一些语法技巧可以让它发挥作用？

已编辑： 我注意到有一个非常相似的问题

Answer 1

为 data 提供初始值以进行解构。

const { loading, error, data: { treatments } = {} } = useQuery(TREATMENTS);

主对象可能未定义时的双重解构

Double Destructuring when main object may be undefined

reactjs

typescript

ecmascript-6

react-apollo