Reactjs 无法使redux表单复选框在引导中工作
我试图在React-Redux表单中使用引导复选框输入,但无法看到输出中的值 我的代码可以很好地与语义UI配合使用Reactjs 无法使redux表单复选框在引导中工作,reactjs,react-bootstrap,react-redux-form,Reactjs,React Bootstrap,React Redux Form,我试图在React-Redux表单中使用引导复选框输入,但无法看到输出中的值 我的代码可以很好地与语义UI配合使用 export const renderCheckbox = ({ input, label }) => { return ( <Form.Field> <Checkbox label={label} checked={input.value ? true : false} onChang
export const renderCheckbox = ({ input, label }) => {
return (
<Form.Field>
<Checkbox
label={label}
checked={input.value ? true : false}
onChange={(e, { checked }) => input.onChange(checked)}
/>
</Form.Field>
);
}
export const renderCheckbox=({input,label})=>{
返回(
input.onChange(选中)}
/>
);
}
尝试在引导中执行相同操作失败
export const renderCheckbox = ({ input, label }) => {
return (
<Form.Group>
<Form.Check
label={label}
checked={input.value ? true : false}
onChange={(e, { checked }) => input.onChange(checked)}
/>
</Form.Group>
);
}
export const renderCheckbox=({input,label})=>{
返回(
input.onChange(选中)}
/>
);
}
我最终会出现以下错误:
TypeError: Cannot destructure property 'checked' of 'undefined' as it is undefined.
onChange
125 | <Form.Check
126 | label={label}
127 | checked={input.value}
> 128 | onChange={(e, { checked }) => input.onChange(checked)}
| ^ 129 | />
130 | </Form.Group>
131 |
TypeError:无法对未定义的属性“checked”进行解构,因为它是未定义的。
一旦改变
125 | 128 | onChange={(e,{checked})=>input.onChange(checked)}
| ^ 129 | />
130 |
131 |
这是它在渲染形式中的外观
<Field
name="email_consent"
id="email_consent"
type="checkbox"
component={renderCheckbox}
label="I would like to receive email offers"
/>
这就是我最后做的,不确定这是否是最佳实践
<div className="form-check">
<Field name="email_consent"
id="email_consent"
component="input"
className="form-check-input"
type="checkbox"
label="I would like to receive email offers"/>
<label className="form-check-label" for="email_consent">Check me out</label>
</div>
看看我
您是否应该替换表单。通过复选框进行检查?如果我按照此处的说明操作,则不会。表单。检查是正确的语法