Как добавить кнопку «Применить» в нижнюю часть окна AntD Date ranger Picker, чтобы запустить вызов API?

В моем отчете есть средство выбора диапазона для выбора начальной и конечной даты. После выбора диапазона дат (при изменении) он вызовет API и получит данные. Но когда пользователь хочет выбрать другой диапазон дат, он вызовет API, только одна дата будет изменена. Как добавить кнопку «ОК» или «Применить» в средство выбора диапазона, чтобы вызвать вызов API при изменении даты. Выбор диапазона теперь реализован, как показано ниже.

      <RangePicker
        format="YYYY-MM-DD"
        onChange={onChange}
        disabledDate={(currentDate) => currentDate.isAfter(moment())}
      />

function onChange(value, dateString) {
/**fetch API**/  }

1 ответ

Вы должны иметь возможность использовать renderExtraFooter особенность.

Я не тестировал этот код, поэтому могут быть ошибки, но что-то вроде:

      <RangePicker
   format="YYYY-MM-DD"
   renderExtraFooter={() => <Button onClick={onChange}>Apply</Button>}
   disabledDate={(currentDate) => currentDate.isAfter(moment())}
/>
Другие вопросы по тегам