传递类型 "checkbox" 未注册到 反应最终形式

Question

我遇到react-final-form的问题，它告诉我没有传递type=checkbox，因此无法正确解包。我有点困惑，因为在这个例子中，自定义组件确实得到了传递给它的type

https://codesandbox.io/s/9o227yp3q4

我看到的是，输入从一个未定义的状态开始，然后在用户输入时切换为true或false。从一个未定义的状态开始，我认为这是导致问题的原因，但我并不乐观。

我收到的错误信息是

Warning: You must pass `type="checkbox"` prop to your Field(attendees[0].isHost) component. Without it we don't know how to unpack your `value` prop - "undefined".

Answer 1

我发现我需要在<Field />上传递type，以便react-final-form可以解压缩这些值并正确应用它们。

export const CustomField: React.SFC<Props> = ({
label,
name,
placeholder,
type
}) => (
<Field name={name} type={type}>
{({ input, meta }) => (
<div>
<StyledLabel htmlFor={name}>{label}</StyledLabel>
<StyledInput
{...input}
id={name}
placeholder={placeholder}
type={type}
/>
{meta.error && meta.touched && <span>{meta.error}</span>}
</div>
)}
</Field>

)