使用antd实现年份选择器控件

import React, { Component } from 'react'
import { DatePicker } from 'antd'
export default class YearPicker extends Component {
constructor(props) {
    super(props)

this.state = {
    isopen:false,
    time:null
}
}


handlePanelChange = (value) => {
    this.setState({
        isopen: false
    })
    this.props.onPanelChange && this.props.onPanelChange(value)
}

handleOpenChange = (status) => { 
    if (status) {
        this.setState({ isopen: true })
    } else {
        this.setState({ isopen: false })
    }
}

clearValue = () => {
    this.props.onPanelChange && this.props.onPanelChange(null)
}
render() {
    return (
        <div>
            <DatePicker
                {...this.props}
                mode="year"
                open={this.state.isopen}
                onOpenChange={this.handleOpenChange}
                onPanelChange={this.handlePanelChange}
                onChange={this.clearValue}
            ></DatePicker>
        </div>
    )
}
}

使用方法如上