Antd的DatePicker 只选择年份使用，及遇到问题处理

一、引入

import {DatePicker} from "antd";

二、使用

<Form.Item label="年份">
    {
       getFieldDecorator('taskYear', {
           rules: [
             {
                required: true,
                message: '请选择任务年份',
             },

           ],})(
           <DatePicker
           placeholder="请选择任务年份"
           mode="year"
           format="YYYY"
           value={taskYear}
           open={yearOpen}
           className={'input'}
           onPanelChange={this.onYearChange}
           onOpenChange={this.yearOpenChange}
           getCalendarContainer={triggerNode => triggerNode.parentNode}
         />)}
</Form.Item>

方法：

    // 年份选择
    onYearChange = value => {
        console.log("选择年份：",value)
        this.onChange('taskYear', value);
        let date = this.props.form.getFieldValue('taskYear')
        this.props.form.setFieldsValue({
            taskYear:value,
        })
        this.setState({ yearOpen: false });
    };
    yearOpenChange = open => {
        console.log("open：",open)

        this.setState({ yearOpen: open });
    };

年份回显设置：

年份回显设置：
this.props.form.setFieldsValue({annualExpenditure: moment(new Date().getFullYear(), 'YYYY')})
this.props.form.setFieldsValue({annualExpenditure:moment(res, 'YYYY'),})

年份从form获取

年份从何form获取：
let formValue = this.props.form.getFieldsValue()
statYear: formValue.meritYear?formValue.meritYear.format('YYYY'):'',

完毕！