Свойство запроса TypeScript не существует

Question

Я пытаюсь добавить типы запросов в запрос GraphQL, используя TypeScript, но я не понимаю, почему TS возвращает мне эту ошибку:

Property 'userMe' does not exist on type 'Query | null'.

Мой запрос:

const { userMe }: Query | null = cache.readQuery({
  query: ME,
});

И мои типы:

export type Query = {
  __typename?: 'Query';
  files?: Maybe<Array<Maybe<UploadFile>>>;
  me?: Maybe<UsersPermissionsMe>;
  userMe?: Maybe<CustomUsersPermissionsMe>;
};

userMe присутствует, но не обязателен. Я не понимаю, почему TS плачет по этому поводу: я использую TS v3.7.5.

Кто-нибудь может мне помочь?

Answer 1

Это потому, что возвращаемое значение cache.readQuery() может быть null. Его тип возвращаемого значения Query | null по виду сообщения об ошибке. Ваш код выдаст исключение, если оно будет нулевым.

Вместо:

const { userMe }: Query | null = cache.readQuery({
  query: ME,
});

Вам необходимо сделать:

const query = cache.readQuery({
  query: ME,
});
const userMe = query && query.userMe ? query.userMe: undefined

Вам нужно разобраться с фактом что результат запроса может быть нулевым, и что userMe может быть undefined в ненулевом запросе.

На высоком уровне TypeScript заставляет вас писать код, который учитывает тот факт, что во время выполнения все может быть null или undefined. Ваша сигнатура типа моделирует два сценария ios, где это может иметь место (нулевой результат запроса и неопределенное поле в ненулевом запросе).

То, как вы справитесь с этим в своем коде, зависит от того, как ваша программа должна вести себя в этой ситуации.

По крайней мере, вы делаете что-то вроде:

if (userMe !=== undefined) {
  // TS now knows that in here userMe is Maybe<CustomUsersPermissionsMe>
}

Вы должны остерегаться неопределенного, потому что он обнуляется на самом объекте Query. И тогда это Maybe, поэтому вам нужно написать кучу охранников.