typescript

typescript Необязательные свойства (поля) объекта. Описание типа (react props)

После имени свойства просто добавляем знак вопроса (если этого свойства может не быть):

type SortSignPropsTypes = {
  onUp?: Function,
  onDown?: Function,
};

Потом эти свойства можно получить разложение объекта:

export default function SortSign(props: SortSignPropsTypes) {
  
  const {onUp, onDown} = props;

typescript Type '{}' is missing the following properties from type Ошибка

Причина

Проблема возникает, если вы не передаете свойство объекта, при том что оно обязательно.

Решение

Указывайте свойства, которых может не быть как необязательные.

typescript object type Тип свойства, ключа объекта. Как его задать

Например так:

type RootActionTypesListType = {
    [key: string]: string | null,
}
let RootActionTypes: RootActionTypesListType = {
    SET_GOODS_LIST_DATA: null,
    RESET_GOODS_LIST: null
};

-- такое определение поможет, если имя ключа будет содержаться в переменной и обращение к элементу будет происходить в виде:

RootActionTypes[keyVlue]

Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '...'. Ошибка

Получаем ошибку:

Element implicitly has an 'any' type because expression of type
 'string' can't be used to index type 'RootActionTypesListType'.
  No index signature with a parameter of type 'string' 
was found on type 'RootActionTypesListType'.  TS7053

    11 | 
    12 | for (const key of Object.keys(RootActionTypes)) {
  > 13 |     RootActionTypes[key] = 'ROOT_' + key;
       |     ^
    14 | }
    15 | RootActionTypes = Object.freeze(RootActionTypes);
    16 |

Для кода вида:

typescript Ключевое слово type. Где оно в документации

type служит для задания псевдонима для новых типов, при этом оно может использоваться и как замена для interface, например:

type GoodType = {
    id: number,
    name: string,
    price: string,
}

Официальная документация:

Typescript Property 'length' does not exist on type Ошибка для типа-массива

Это ошибка не должна возникать, если ваш тип описан как массив.

Убедитесь, что определение связано с массивом, например:

type GoodType = {
    id: number,
    name: string,
    price: string,
}

export  type GoodsListType =  Array<GoodType>; 

-- в данном случае GoodsListType это массив и свойство lenght для него задано.

typescript react Пример описания копонента и его пропсов

Простейший вариант:

import React from 'react'; // we need this to make JSX compile

// описание типа пропсов
type CardProps = {
  title: string,
  paragraph: string
}

// описание самого копонента
export const Card = ({ title, paragraph }: CardProps) => <aside>
  <h2>{ title }</h2>
  <p>
    { paragraph }
  </p>
</aside>

const el = <Card title="Welcome!" paragraph="To this example" />

Источник: https://fettblog.eu/typescript-react/com...

[!] Typescript по-русски

Что почитать

Cannot find module '...' or its corresponding type declarations React Typescript Ошибка для использования псевдонима пути alias

Cannot find module '...' or its corresponding type declarations

Возникает для строки:

import SortSign from '@app-universal/SortSign';

Задача

Рассмотрим решение для следующей ситуации, компонент без псевдонимов имопртируется так (в какой-то из родительских компонентов):

import SortSign from '../../../universal/SortSign';

а требуется его импортировать так:

import SortSign from '@app-universal/SortSign';

или так:

vscode Cannot use JSX unless the '--jsx' flag is provided Ошибка

Cannot use JSX unless the '--jsx' flag is provided

Помогает следующее решение:
Идем в tsconfig.json и меняем

    "jsx": "react-jsx"

на

    "jsx": "react"

Источник: https://stackoverflow.com/a/64946881

Pages

Subscribe to RSS - typescript