Ответ 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",
В проекте 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>;
Но мне не нравится, когда нужно использовать утверждение, и я не понимаю, в чем проблема, или если я что-то делаю неправильно. Это проблема с типизиями, которые могут быть исправлены?
ошибка сборки с 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",
Вы можете установить новые пиктограммы, используя:
npm i @types/react-dnd --save-dev
если вы уже установили другие тиски, удалите его, используя:
typings uninstall --save --global react-dnd
После этого он должен работать как ожидалось.