Ant.design在Form.Item React中未检测到自定义输入组件

Question

因此，主要问题是，antd表单无法检测到基于antd标准输入的自定义输入：有一个表单代码(AddProduct(：

                   <Form.Item
                        className="m-t-10"
                        name="price"
                        rules={[
                            {
                                required: true,
                                message: `${t('FORM.ERR.SHOP.PRICE')}`,
                            },
                        ]}
                    >
                        <CurrencyInput size="small" placeholder={t('FORM.SHOP.PRICE_VAT')} name="price" />
                    </Form.Item>

有我的自定义输入(CurrencyInput(：

return (
    <Input size={props.size} placeholder={props.placeholder} name={props.name} type="number" prefix={settings[6].value} />
)

问题是，当我试图提交表单时，它没有检测到货币输入，导致错误，认为该字段是必需的。有什么想法可以实现自定义输入吗？基本上，它比自定义输入更像HOC

Answer 1

您需要将所有道具传递给您的自定义组件，因为Form.Item传递给那里的是onChange和value道具

function CustomInput({size, placehodler, name, ...restProps}) {
  return (
    <Input size={size} placeholder={placeholder} name={name} 
      type="number" prefix={settings[6].value} {...restProps} />
  )
}