Подтвердить что ты не робот

TypeScript 2.0 с реакцией-dnd дает ошибку "Атрибуты элемента JSX могут не быть типом объединения"

В проекте TypeScript + React я использую react-dnd с Определенно типизированные тиски:

interface ExampleScreenProps { a, b, c }
interface ExampleScreenState { x, y, z }

class ExampleScreen extends React.Component<ExampleScreenProps, ExampleScreenState> { }

export default DragDropContext(HTML5Backend)(ExampleScreen);

Это отображается в другом компоненте:

import ExampleScreen from "./ExampleScreen";

<ExampleScreen a="a" b="b" c="c" />

Это работает в TS 1.8 без каких-либо ошибок. Когда я обновился до TS 2.0, я получил следующую ошибку компиляции:

Ошибка: (90, 10) TS2600: тип атрибутов элемента JSX '(ПримерScreenProps и {children?: ReactNode;}) | (ExampleScreenProps и {children... "не могут быть типом объединения.

Это определение типа для DragDropContext:

export function DragDropContext<P>(
    backend: Backend
): <P>(componentClass: React.ComponentClass<P> | React.StatelessComponent<P>) => ContextComponentClass<P>;

Я не могу собрать это вместе. За что жаловаться? Кажется, что ему не нравится объединение ComponentClass<P> | StatelessComponent<P>, но это не атрибуты элемента, атрибуты элемента просто <P>. Я пробовал явно пропустить <P>:

export default DragDropContext<ExampleProps>(HTML5Backend)(ExampleScreen);

Но такая же ошибка сохраняется. Я могу обойти это, утверждая вывод:

export default DragDropContext(HTML5Backend)(ExampleScreen) as React.ComponentClass<ExampleProps>;

Но мне не нравится, когда нужно использовать утверждение, и я не понимаю, в чем проблема, или если я что-то делаю неправильно. Это проблема с типизиями, которые могут быть исправлены?

4b9b3361

Ответ 1

ошибка сборки с typescript 2.4.2
и используемые зависимости:

    "react": "^15.6.1",
    "react-dom": "^15.6.1",
    "react-dnd":"^2.4.0"

    "@types/react": "^16.0.5",
    "@types/react-dom": "^15.0.0",
    "@types/react-dnd":"^2.0.33",

Ответ 2

Вы можете установить новые пиктограммы, используя:

npm i @types/react-dnd --save-dev

если вы уже установили другие тиски, удалите его, используя:

typings uninstall --save --global react-dnd

После этого он должен работать как ожидалось.