RangePicker Ant 设计的重置值答案

【问题标题】：Reset value of RangePicker Ant designRangePicker Ant 设计的重置值
【发布时间】：2021-02-15 06:47:33
【问题描述】：

我在我的应用程序中使用来自 ant design 的 RangePicker。我遇到了以下问题：何时单击“重置”按钮我无法清除 RangePicker 组件中的值。请帮我怎么做？我试过分配 defaultValue 但它不起作用。

【问题讨论】：

【解决方案1】：

改用 RangePicker 的 value 参数。像这样的东西应该可以工作。无法制作环境并对其进行测试，但希望您能理解。如果有不清楚的地方，请提出任何问题。

const SomeComponent = props => {
const [fromDate, setFromDate] = useState('2000-01-01');
const [toDate, setToDate] = useState('2000-01-02');

const onChangeDateRange = (dates, datesString) => {
 setFromDate(datesString[0]);
 setFromDate(datesString[1]);
//More code
}
const onResetClick = () => {
 setFromDate('2000-01-01');
setToDate('2000-01-02');
}

return (
<>
 <RangePicker
      onChange={onChangeDateRange}
      value={[moment(fromDate, dateFormat), moment(toDate, dateFormat)]}
    />
<Button onClick={onResetClick}>Reset</Button
</>
)
}

关于 ant design 的文档非常好，最后您可以找到组件可以具有的所有可用参数。 DatePicker 例如有一个允许清除。 https://ant.design/components/date-picker/

【讨论】：