Использование disabledDate в Antd Datepicker в таблице

Question

import React from "react";
import ReactDOM from "react-dom";
import { version, DatePicker, Table } from "antd";
import "antd/dist/antd.css";
import "./index.css";
import moment from "moment";

function disabledDate(current) {
  const now = moment();
  return (
    current &&
    (current < now.subtract(1, "day") || current > now.add(6, "months"))
  );
}

const columns = [
  {
    title: "date",
    dataIndex: "date",
    render: text => {
      return <DatePicker disabledDate={disabledDate} value={moment(text)} />;
    }
  }
];

const dataSource = [
  {
    key: "1",
    date: 1582863300000
  },
  {
    key: "2",
    date: 1583761200000
  }
];

ReactDOM.render(
  <div className="App">
    <p>antd version:{version}</p>
    <Table columns={columns} dataSource={dataSource} />
  </div>,
  document.getElementById("root")
);

Я использую Antd Datepicker, и я хочу, чтобы пользователи могли выбирать только сегодня, а не через 6 месяцев. Но в таблице первая строка в порядке, вторая - вчера. Вот ссылка для кодов и ящиков: https://codesandbox.io/s/antd-reproduction-template-u1edz

Answer 1

Это не проблема с DatePicker, так как если вы установите те же две даты, вы увидите тот же результат, проблема связана со второй датой, которую вы предоставляете, и с disabledDate logi c.

const dataSource = [
  {
    key: '1',
    date: 1582863300000
  },
  {
    key: '2',
    // set the same date and see no diff date: 1582863300000
    date: 1583761200000
  }
];

Как я понимаю, вы хотите реализовать следующую логику c:

today <= can be selected <= today + 6 months

Что составляет:

function disabledDate(current) {
  const now = moment();
  return (
    current && (now.endOf('day') > current || current > now.add(6, 'months'))
  );
}