Javascript react bootstrap-表单检查(单选按钮)即使在重置后也会被选中
单选按钮(来自react bootstrap Form.Check)被选中,即使选中的道具值在单击重置按钮后变为false(重置仅运行formik提供的重置表单方法)。这是在formik内部使用的,当redux状态更改时,它将重新呈现。Javascript react bootstrap-表单检查(单选按钮)即使在重置后也会被选中,javascript,reactjs,redux,bootstrap-4,react-bootstrap,Javascript,Reactjs,Redux,Bootstrap 4,React Bootstrap,单选按钮(来自react bootstrap Form.Check)被选中,即使选中的道具值在单击重置按钮后变为false(重置仅运行formik提供的重置表单方法)。这是在formik内部使用的,当redux状态更改时,它将重新呈现。 下面是创建此问题的代码,其中我还添加了一个调试行,以在所附的图像中显示选中条件的值 const handleSubmitClick = (_data: any) => { dispatch(setUploadSatus({submitted: true
下面是创建此问题的代码,其中我还添加了一个调试行,以在所附的图像中显示选中条件的值
const handleSubmitClick = (_data: any) => {
dispatch(setUploadSatus({submitted: true, form: _data}));
}
const status = useSelector(uploadSatus);
const genderOptions = [
{ value: 'Female', label: 'Female' },
{ value: 'Male', label: 'Male' },
];
*
**some code**
*
<Formik
onSubmit={data => handleSubmitClick(data)}
initialValues={{
age: '',
gender: '',
condition: '',
symptoms: [],
files: [],
...status.form
}}
validationSchema={schema}
>
{({
handleSubmit,
handleChange,
setFieldValue,
resetForm,
values,
touched,
errors,
setTouched,
initialTouched
}) => (
<Form noValidate onSubmit={handleSubmit} onReset={resetForm}>
{genderOptions.map((gender: any) => {
return <>
{values.gender === gender.value ? 'True' : 'Flase'}
<Form.Check
inline
type="radio"
name="gender"
value={gender.value}
checked={values.gender === gender.value}
onChange={handleChange}
label={gender.label}
disabled={status.submitted}
isValid={touched.gender && !errors.gender && !status.submitted}
isInvalid={touched.gender && !!errors.gender}
/></>
<Button type="reset" variant="info" className="btn-block">
Reset
</Button>
</Form>
)
}
</Formik>
const handleSubmitClick=(\u data:any)=>{
调度(setUploadSatus({提交:true,格式:_data}));
}
const status=使用选择器(上传状态);
常数性别选项=[
{值:'Female',标签:'Female'},
{值:'Male',标签:'Male'},
];
*
**一些代码**
*
handleSubmitClick(数据)}
初始值={{
年龄:'',
性别:'',
条件:“”,
症状:[],
文件:[],
…状态.form
}}
validationSchema={schema}
>
{({
手推,
handleChange,
setFieldValue,
重新设置表单,
价值观
感动的,
错误,
被感动了,
最初接触
}) => (
{genderOptions.map((性别:任意)=>{
返回
{values.gender===gender.value?'True':'Flase'}
重置
)
}
最初在单击重置按钮之前,单击重置后,
您能再给我们一些代码吗?我们甚至看不到handlechange函数。@varjod handlechange由formik提供。您能再给我们一些代码吗?我们甚至看不到handlechange函数。@varjod handlechange由formik提供