erikras / redux-form-material-ui

A set of wrapper components to facilitate using Material UI with Redux Form
http://erikras.github.io/redux-form-material-ui/
MIT License
831 stars 228 forks source link

Types of property 'component' are incompatible #260

Open cuyu opened 6 years ago

cuyu commented 6 years ago

Hi, I just use this lib with redux-form and get these errors when compiling with typescript:

(13,33): Types of property 'component' are incompatible.
  Type 'typeof Checkbox' is not assignable to type '"input" | "select" | "textarea" | ComponentClass<WrappedFieldProps & CheckboxProps> | StatelessCo...'.
    Type 'typeof Checkbox' is not assignable to type 'StatelessComponent<WrappedFieldProps & CheckboxProps>'.
      Type 'typeof Checkbox' provides no match for the signature '(props: WrappedFieldProps & CheckboxProps & { children?: ReactNode; }, context?: any): ReactElement<any> | null'.

The codes are:

import * as React from 'react';
import {Field, reduxForm} from 'redux-form';
import {
    Checkbox,
} from 'redux-form-material-ui'
import FormLabel from "@material-ui/core/FormLabel/FormLabel";

let MonitorCrashForm = (props: any) => {
    return (
        <form className='left-form'>
            <FormLabel component="legend">How to receive the crash alert:</FormLabel>
            <Field name="email" component={Checkbox} label="Email?"/>
            <Field name="slack" component={Checkbox} label="Slack?"/>
        </form>
    )
};

export default reduxForm({
    // a unique name for the form
    form: 'monitorCrash'
})(MonitorCrashForm)

The versions are:

"redux-form": "^7.4.2",
"redux-form-material-ui": "^4.3.4",
"typescript": "^2.9.2"

Looks like the declaration is wrong?

davakh commented 5 years ago

fast fix for me was component={Checkbox as "div"}