使用具有还原形式的antd

Question

我正在尝试使用我的redux-form使用ant.design react组件,到目前为止它是这样的:

import { Form, Input } from 'antd';
import { Field, reduxForm } from 'redux-form/immutable';
const FormItem = Form.Item;

.....

<FormItem>
  <Field
     component={Input}
     placeholder="First Name"
     name="name"
  />
</FormItem>

看起来antd表单输入不支持name属性,它们忽略并阻止将其传递下去.

name redux-form需要属性才能工作.

有没有人成功让这两个人一起工作？谢谢.

Answer 1

除了Maxim的回答,我还必须将r​​edux-form props.inputcomp 传递给antd Input组件.

const NewInput = ({
        label,
        labelCol,
        wrapperCol,
        help,
        extra,
        validateStatus,
        hasFeedback = true,
        colon,
        ...rest
}) => {
  return (<FormItem
    label={label}
    wrapperCol={wrapperCol}
    labelCol={labelCol}
    help={help}
    hasFeedback={hasFeedback}
    extra={extra}
    validateStatus={validateStatus}
    colon={colon}
  >
    <Input {...rest.input} />
  </FormItem>);
};