From de9b211627756f39ff4752efe4ac00c27eb7bb87 Mon Sep 17 00:00:00 2001 From: afc163 Date: Fri, 29 May 2015 15:06:45 +0800 Subject: [PATCH] Add datapicker disabled demo --- components/datepicker/demo/range.md | 17 ++++++----------- components/datepicker/index.jsx | 6 +++++- 2 files changed, 11 insertions(+), 12 deletions(-) diff --git a/components/datepicker/demo/range.md b/components/datepicker/demo/range.md index 2c9283107b..9164dcac58 100644 --- a/components/datepicker/demo/range.md +++ b/components/datepicker/demo/range.md @@ -1,24 +1,19 @@ # 范围 - order: 3 -- description: 设置可选日期的范围,用 disabled 方法来定义不可选择时间。 +- description: 设置可选日期的范围,用 disabled 方法来定义不可选择时间。比如不可选择今天之后的日期。 --- ````jsx var Datepicker = antd.datepicker; - -var Picker = React.createClass({ - handleChange: function(value) { - console.log(new Date(value.getTime())); - }, - render: function() { - return - } -}); +var disabledDate = function(current, value) { + // can not select days after today + return current.getTime() > Date.now(); +}; React.render( - + , document.getElementById('components-datepicker-demo-range')); ```` diff --git a/components/datepicker/index.jsx b/components/datepicker/index.jsx index f7aad6209a..62b462a388 100644 --- a/components/datepicker/index.jsx +++ b/components/datepicker/index.jsx @@ -21,11 +21,14 @@ module.exports = React.createClass({ }; }, componentDidMount: function () { + var state = {}; if (this.props.value) { var value = new GregorianCalendar(zhCn); value.setTime(new Date(this.props.value)); - this.setState({value: value}); + state.value = value; } + state.disabled = this.props.disabled || function() {}; + this.setState(state); }, handleChange: function() { var props = this.props; @@ -34,6 +37,7 @@ module.exports = React.createClass({ render: function () { var calendar = (