Reactjs 提交值后如何重置antd日期选择器?

Reactjs 提交值后如何重置antd日期选择器?,reactjs,gatsby,antd,formik,yup,Reactjs,Gatsby,Antd,Formik,Yup,在这里,我提供了使用codesandbox的示例。提交表单后如何重置日期选择器值 state = { setFieldValue: '' } onChange = (setFieldValue) => { this.setState({ setFieldValue: null }) } render() { const { values, handleSubmit } = this.props

在这里,我提供了使用codesandbox的示例。提交表单后如何重置日期选择器值

    state = {
        setFieldValue: ''
    }

    onChange = (setFieldValue) => {
        this.setState({ setFieldValue: null })
      }


    render() {
        const { values, handleSubmit } = this.props
        return (
            <div align="center">
                <Form onSubmit={handleSubmit}>

                             <Field
                                name="dateofbirth"
                                label="dateOfBirth"
                                component={DateInput}
                                formitemlayout={formItemLayout}
                                value={this.state.setFieldValue}
                                onChange={this.onChange}


                            />


                            <Button type="primary" 
          htmlType="submit">Submit</Button>
}
状态={
setFieldValue:“”
}
onChange=(setFieldValue)=>{
this.setState({setFieldValue:null})
}
render(){
const{values,handleSubmit}=this.props
返回(
提交
}

我的工作代码沙盒链接是

您的日期选择器不是受控组件。我将其转换为受控组件,并在提交表单后重置了日期字段


setFieldValue(“dateofbirth”,日期字符串)
}
值={dateofbirth!==“”?时刻(dateofbirth):“”

/>
最好使用
null

<DatePicker
  onChange={(date, dateString) =>
    setFieldValue("dateofbirth", dateString)
  }
  value={dateofbirth !== "" ? moment(dateofbirth) : null}
/>

setFieldValue(“dateofbirth”,日期字符串)
}
值={dateofbirth!==“”?时刻(dateofbirth):null}
/>