TypeScript + React プロジェクトでは、私はreact-dndをそのFixedTyped 型指定で使用しています:
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 要素属性の型 '(ExampleScreenProps & { 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>;
しかし、私はアサーションを使わなければならないのが好きではなく、実際の問題を理解していないか、何か間違っているかどうかを理解していません。これは、修正可能なタイピングの問題ですか?