Почему возникли ошибки "Это выражение невозможно вызвать ..." из typescript и react js?

#reactjs #typescript

Вопрос:

Я новичок в typescript. Я не знаю, почему возникла ошибка. мой массив списка данных:

   const {
    data: CUData = { cu: [] as Array<CuType> },
  } = useGetCUQuery();

  let CUDataArray = CUData amp;amp; CUData.cu? CUData.cu:null;

  const ownCompany = CUDataArray !== null amp;amp; CUDataArray.filter( 
      company => (company.isOwner amp;amp; company.userType === 2) 
    );

  const assignedCompany = CUDataArray!== null amp;amp; CUDataArray.filter( 
    company => (!company.isOwner amp;amp; company.userType === 3) 
  );

Ошибка:

 > This expression is not callable.
  Each member of the union type '{ <S extends CuType>(cb: (value: CuType, index: number, array: CuType[]) => value is S, thisArg?: any): S[]; (cb: (value: CuType, index: number, array: CuType[]) => unknown, thisArg?: any): CuType[]; } | { ...; }' has signatures, but none of those signatures are compatible with each other.  TS2349

1. Я только что опубликовал ответ, но затем снова просмотрел сообщение об ошибке, и теперь я не уверен в этом. Можете ли вы опубликовать часть своего кода, которая включает <S extends CuType> и value is S ? Похоже, где-то есть функция защиты типа, которая может вызывать проблемы.

Ответ №1:

Typescript не уверен, является ли тип массива CUDataArray CuType[] or unknown[] . Источник этой путаницы исходит из возвращаемого типа вашей useGetCUQuery() функции. Если вы отредактируете свой пост с помощью этой функции, я могу посмотреть на него.

  const {
    data: CUData = { cu: [] as Array<CuType> },
  } = useGetCUQuery();

Обратите внимание, что as Array<CuType> здесь применяется только к пустому массиву, который вы используете по умолчанию, а не к переменной CUData , если она исходит из data .

В конечном итоге вы хотите исправить unknown возвращаемый тип в его источнике, которым является useGetCUQuery() функция. Но мы также можем применить тип к переменной, которую мы получаем от нее. Помогает ли это вообще?

 type CUQueryVal = {
    data?: {
        cu?: Array<CuType>
    }
}

const queried: CUQueryVal = useGetCUQuery();

const { data: CUData = { cu: [] } } = queried; // 'as' is no longer needed

Ссылка на игровую площадку