如何根据选择将时刻设置为空答案

【问题标题】：How to set moment to empty depending on select如何根据选择将时刻设置为空
【发布时间】：2021-08-22 12:21:42
【问题描述】：

我想在选择项目更改时将开始日期和结束日期设置为未定义，我使用了 useEffect 来处理此问题，但在 UI 上日期未设置为空。这是我的代码

const [startDate, setStartDate] = useState<moment.Moment>();
const [endDate, setEndDate] = useState<moment.Moment>();

  const onChange = useCallback(
    (value) => {
      setEndDate(value);

    },
    [setEndDate, setIsMoreThenBalance]
  );

  const onChangeStartDate = useCallback(
    (value) => {
      setStartDate(value);
    },
    [setStartDate]
  );

  useEffect(() => {
    if (selectedLeaveId) {
      setStartDate(undefined);
      setEndDate(undefined);

    }
  }, [selectedLeaveId]);

return(

    <StyleDatePicker
      onChange={(date) => {
        onChangeStartDate(date);
      }}
      disabledDate={disableStartDate}
      value={startDate}
      format="DD/MM/YYYY"
      autoFocus
    />

    <StyleDatePicker
      onChange={(date) => {
         onChange(date);
      }}
      value={endDate}
      disabled={!startDate}
      disabledDate={disableEndDate}
      $isThereError={isMoreThenBalance}
      format="DD/MM/YYYY"
     />
 )

日期选择器应在每次选择另一个离开时清除 startDate 和 endDate

【问题讨论】：

你能分享一个简单的codesandbox代码示例吗？
什么是 selectedLeaveId 除了作为依赖项或条件之外，在您的代码中的任何地方都看不到它？无论如何，您不应将状态隐式设置为矩对象，而在您不想将其设置为未定义时将其设置为矩对象。传递 undefined 时，Moment 将始终返回当前日期。

标签： javascript reactjs momentjs antd

【解决方案1】：

我已经解决了这个问题，只需在此处添加 form.resetFileds()

useEffect(() => {
   if (selectedLeaveId) {
     setStartDate(undefined);
     setEndDate(undefined);
     form.resetFileds();

   }
 }, [selectedLeaveId]); ```

and it's work fine . thank you

【讨论】：