diff --git a/docs/calendar/index.en-us.md b/docs/calendar/index.en-us.md
index 69c09c8779..fe36158e4c 100644
--- a/docs/calendar/index.en-us.md
+++ b/docs/calendar/index.en-us.md
@@ -41,5 +41,6 @@ moment.locale('zh-cn');
| onModeChange | Callback when change mode
**签名**:
Function(mode: string) => void
**参数**:
_mode_: {string} mode type: date month year | Function | func.noop |
| dateCellRender | Render function for date cell
**signature**:
Function(value: Object) => ReactNode
**parameter**:
_value_: {Object} date object
**return**:
{ReactNode} null
| Function | (value) => value.date() |
| monthCellRender | Render function for month cell
**signature**:
Function(calendarDate: Object) => ReactNode
**parameter**:
_calendarDate_: {Object} current date object
**return**:
{ReactNode} null
| Function | - |
+| yearRange | Year Range，[START_YEAR, END_YEAR] \(only shape in ‘card’, 'fullscreen') | Array<Number> | - |
| disabledDate | Function to disable dates
**signature**:
Function(calendarDate: Object) => Boolean
**parameter**:
_calendarDate_: {Object} current date object
_view_: {Enum} current view type: 'year', 'month', 'date'
**return**:
{Boolean} null
| Function | - |
diff --git a/docs/calendar/index.md b/docs/calendar/index.md
index 5173c834fa..b09b2a88fa 100644
--- a/docs/calendar/index.md
+++ b/docs/calendar/index.md
@@ -29,17 +29,18 @@ moment.locale('zh-cn');
### Calendar
-| 参数 | 说明 | 类型 | 默认值 |
-| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------- | --------------------- |
-| defaultValue | 默认选中的日期（moment 对象） | custom | - |
-| shape | 展现形态
**可选值**:
'card', 'fullscreen', 'panel' | Enum | 'fullscreen' |
-| value | 选中的日期值 (moment 对象) | custom | - |
-| mode | 面板模式
**可选值**:
'date', 'month', 'year' | Enum | - |
-| showOtherMonth | 是否展示非本月的日期 | Boolean | true |
-| defaultVisibleMonth | 默认展示的月份
**签名**:
Function() => void | Function | - |
-| onSelect | 选择日期单元格时的回调
**签名**:
Function(value: Object) => void
**参数**:
_value_: {Object} 对应的日期值 (moment 对象) | Function | func.noop |
-| onModeChange | 面板模式变化时的回调
**签名**:
Function(mode: String) => void
**参数**:
_mode_: {String} 对应面板模式 date month year | Function | func.noop |
-| onVisibleMonthChange | 展现的月份变化时的回调
**签名**:
Function(value: Object, reason: String) => void
**参数**:
_value_: {Object} 显示的月份 (moment 对象)
_reason_: {String} 触发月份改变原因 | Function | func.noop |
-| dateCellRender | 自定义日期渲染函数
**签名**:
Function(value: Object) => ReactNode
**参数**:
_value_: {Object} 日期值（moment对象）
**返回值**:
{ReactNode} null
| Function | value => value.date() |
-| monthCellRender | 自定义月份渲染函数
**签名**:
Function(calendarDate: Object) => ReactNode
**参数**:
_calendarDate_: {Object} 对应 Calendar 返回的自定义日期对象
**返回值**:
{ReactNode} null
| Function | - |
-| disabledDate | 不可选择的日期
**签名**:
Function(calendarDate: Object, view: String) => Boolean
**参数**:
_calendarDate_: {Object} 对应 Calendar 返回的自定义日期对象
_view_: {String} 当前视图类型，year: 年， month: 月, date: 日
**返回值**:
{Boolean} null
| Function | - |
+| 参数 | 说明 | 类型 | 默认值 |
+| -------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------- | --------------------- |
+| defaultValue | 默认选中的日期（moment 对象） | custom | - |
+| shape | 展现形态
**可选值**:
'card', 'fullscreen', 'panel' | Enum | 'fullscreen' |
+| value | 选中的日期值 (moment 对象) | custom | - |
+| mode | 面板模式
**可选值**:
'date', 'month', 'year' | Enum | - |
+| showOtherMonth | 是否展示非本月的日期 | Boolean | true |
+| defaultVisibleMonth | 默认展示的月份
**签名**:
Function() => void | Function | - |
+| onSelect | 选择日期单元格时的回调
**签名**:
Function(value: Object) => void
**参数**:
_value_: {Object} 对应的日期值 (moment 对象) | Function | func.noop |
+| onModeChange | 面板模式变化时的回调
**签名**:
Function(mode: String) => void
**参数**:
_mode_: {String} 对应面板模式 date month year | Function | func.noop |
+| onVisibleMonthChange | 展现的月份变化时的回调
**签名**:
Function(value: Object, reason: String) => void
**参数**:
_value_: {Object} 显示的月份 (moment 对象)
_reason_: {String} 触发月份改变原因 | Function | func.noop |
+| dateCellRender | 自定义日期渲染函数
**签名**:
Function(value: Object) => ReactNode
**参数**:
_value_: {Object} 日期值（moment对象）
**返回值**:
{ReactNode} null
| Function | value => value.date() |
+| monthCellRender | 自定义月份渲染函数
**签名**:
Function(calendarDate: Object) => ReactNode
**参数**:
_calendarDate_: {Object} 对应 Calendar 返回的自定义日期对象
**返回值**:
{ReactNode} null
| Function | - |
+| yearRange | 年份范围，[START_YEAR, END_YEAR] \(只在shape 为 ‘card’, 'fullscreen' 下生效) | Array<Number> | - |
+| disabledDate | 不可选择的日期
**签名**:
Function(calendarDate: Object, view: String) => Boolean
**参数**:
_calendarDate_: {Object} 对应 Calendar 返回的自定义日期对象
_view_: {String} 当前视图类型，year: 年， month: 月, date: 日
**返回值**:
{Boolean} null
| Function | - |
diff --git a/src/calendar/calendar.jsx b/src/calendar/calendar.jsx
index 237b9ec6ea..9ebb40071f 100644
--- a/src/calendar/calendar.jsx
+++ b/src/calendar/calendar.jsx
@@ -63,7 +63,7 @@ class Calendar extends Component {
onSelect: PropTypes.func,
/**
* 面板模式变化时的回调
- * @param {Object} mode 对应面板模式 date month year
+ * @param {String} mode 对应面板模式 date month year
*/
onModeChange: PropTypes.func,
/**
@@ -89,6 +89,10 @@ class Calendar extends Component {
*/
monthCellRender: PropTypes.func,
yearCellRender: PropTypes.func, // 兼容 0.x yearCellRender
+ /**
+ * 年份范围，[START_YEAR, END_YEAR] (只在shape 为 ‘card’, 'fullscreen' 下生效)
+ */
+ yearRange: PropTypes.arrayOf(PropTypes.number),
/**
* 不可选择的日期
* @param {Object} calendarDate 对应 Calendar 返回的自定义日期对象
@@ -232,6 +236,7 @@ class Calendar extends Component {
monthCellRender,
yearCellRender,
disabledDate,
+ yearRange,
...others
} = this.props;
const state = this.state;
@@ -330,7 +335,7 @@ class Calendar extends Component {
{shape === 'panel' ? (
panelHeaders[state.mode]
) : (
-
+
)}
{tables[state.mode]}
diff --git a/src/calendar/head/card-header.jsx b/src/calendar/head/card-header.jsx
index 97fa9289a2..2562b5895a 100644
--- a/src/calendar/head/card-header.jsx
+++ b/src/calendar/head/card-header.jsx
@@ -5,6 +5,7 @@ import Radio from '../../radio';
class CardHeader extends React.PureComponent {
static propTypes = {
+ yearRange: PropTypes.arrayOf(PropTypes.number),
yearRangeOffset: PropTypes.number,
locale: PropTypes.object,
};
@@ -18,12 +19,16 @@ class CardHeader extends React.PureComponent {
};
getYearSelect(year) {
- const { prefix, yearRangeOffset, locale } = this.props;
- const startYear = year - yearRangeOffset;
- const endYear = year + yearRangeOffset;
+ const { prefix, yearRangeOffset, yearRange = [], locale } = this.props;
+
+ let [startYear, endYear] = yearRange;
+ if (!startYear || !endYear) {
+ startYear = year - yearRangeOffset;
+ endYear = year + yearRangeOffset;
+ }
const options = [];
- for (let i = startYear; i < endYear; i++) {
+ for (let i = startYear; i <= endYear; i++) {
options.push(
{i}