提交值后如何重设antd datepicker? [英] How to reset antd datepicker after submiting a value?

查看:454
本文介绍了提交值后如何重设antd datepicker?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

在这里,我提供了在codeandbox上工作的示例示例.提交表单后如何重设datepicker值?

here i am providing my sample example working on codesandbox. How to reset a datepicker value after submitting a form?

    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>
}

我的工作codeandbox链接为在此处输入链接描述

my working codesandbox link is enter link description here

推荐答案

与其添加空字符串(因为它会引发propType错误),不如使用null

Instead of adding empty strings as it raises a propType error its best to use null

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

这篇关于提交值后如何重设antd datepicker?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆