react-redux types give errors when used as decorators #20796
Description
- I tried using the
@types/react-reduxpackage and had problems.- Authors: @tkqubo @thasner @kenzierocks @clayne11 @tansongyang @NicholasBoll @mDibyo
Using typescript 2.5.3
Code to reproduce the error:
import * as React from "react";
import {connect} from "react-redux";
interface IStore {
myVar: any;
}
interface MyComponentProps {
dispatch?: any;
a;
}
function mapStateToProps(state: IStore) {
return {
a: state.myVar
};
}
@connect(mapStateToProps)
export class MyComponent extends React.Component<any, any>
{
constructor(props, context)
{
super(props, context);
}
render()
{
return (<div>
<h2>Hello</h2>
</div>);
}
}Error Msg:
MyComponent.tsx(19,1): error TS1238: Unable to resolve signature of class decorator when called as an expression.
Type 'ComponentClass<Pick<any, never>> & { WrappedComponent: ComponentType<any>; }' is not assignable to type 'typeof MyComponent'.
Type 'Component<Pick<any, never>, ComponentState>' is not assignable to type 'MyComponent'.
Types of property 'render' are incompatible.
Type '() => false | Element' is not assignable to type '() => Element'.
Type 'false | Element' is not assignable to type 'Element'.
Type 'false' is not assignable to type 'Element'.
Currently to make this error go away, the signature of render() method of MyComponent needs to be modified like this:
render(): JSX.Element | false
{
return (<div>
<h2>Hello</h2>
</div>);
}This change of signature should not be required in code by the type definition.