Question

我正在为 ant design3 date picker 使用react type脚本项目，没有为他们提供年选择器，我得到了一些解决方案，是否在这里mode="year"，那么年选择器正在工作但无法绑定该值，所选年份不会显示。有人知道一些解决方案吗？

stack blitz here

谢谢

在此处编码

import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import './index.css';
import { DatePicker } from 'antd';

const { MonthPicker, RangePicker, WeekPicker, } = DatePicker;

function onChange(date, dateString) {
  console.log(date, dateString);
}

ReactDOM.render(
  <div>
    <DatePicker onChange={onChange} mode="year" placeholder="Select year"/>
    <br />
        <br />
   

  </div>,
  document.getElementById('container'),
);

Answer 1

这是antd版本3上的FAQ之一

当我将模式设置为DatePicker / RangePicker时，不能再选择年份或月份了吗？

在现实世界中，您可能需要YearPicker， MonthRangePicker或WeekRangePicker。您正在尝试将模式添加到 DatePicker / RangePicker应该实现这些选择器。然而， DatePicker / RangePicker无法选择，面板也不会现在关闭。

就像这里的解释，那是因为不等于YearPicker，不等于到MonthRangePicker。增加了mode属性以支持在antd 3.0中的DatePicker中显示时间选择器面板，控制显示的面板，并且不会更改原始日期选择 DatePicker / RangePicker的行为（例如，您仍然需要单击日期单元格以完成DatePicker中的选择，无论采用哪种模式是）。

这是解决方法之一

您可以使用模式和引用此article或本文 onPanelChange为您封装YearPicker或MonthRangePicker 需要。或者，您可以等待我们计划在其中进行的antd@4.0 为这些要求添加更多的XxxPickers。

似乎您可以使用REFERENCING AS来获取值

onPanelChange

在此处stackblitz查看工作代码

Answer 2

您是否正在使用其他版本的antd？该演示正常运行。 click here。

  <DatePicker onChange={onChange} picker="year" />

蚂蚁设计3年选择器选择的值不显示

2 个答案: