diff --git a/demo/src/components/Main.js b/demo/src/components/Main.js index 06e0b5356..33620a757 100644 --- a/demo/src/components/Main.js +++ b/demo/src/components/Main.js @@ -146,6 +146,10 @@ export default class Main extends Component { } render() { + const cellInfo = [ + { date: addDays(new Date(), 1), value: '$ 20' }, + { date: addDays(new Date(), 2), value: '$ 120' }, + ]; return (

React-date-range

@@ -347,6 +351,8 @@ export default class Main extends Component { className={'PreviewArea'} disabledDates={[new Date(), addDays(new Date(), 3)]} minDate={addDays(new Date(), -3)} + cellInfo={cellInfo} + cellInfoClassName="abc" />
diff --git a/src/components/DayCell.js b/src/components/DayCell.js index 72bda900e..695fcf67b 100644 --- a/src/components/DayCell.js +++ b/src/components/DayCell.js @@ -161,7 +161,13 @@ class DayCell extends Component { )); } render() { - const { styles } = this.props; + const { styles, cellInfoClassName, cellInfo } = this.props; + let dayInfo = []; + if (this.props && this.props !== 'undefined' && cellInfo) { + dayInfo = this.props.cellInfo.filter(data => { + return isSameDay(new Date(data.date), new Date(this.props.day)); + }); + } return ( ); } @@ -223,6 +236,8 @@ DayCell.propTypes = { onMouseDown: PropTypes.func, onMouseUp: PropTypes.func, onMouseEnter: PropTypes.func, + cellInfo: PropTypes.array, + cellInfoClassName: PropTypes.string, }; export default DayCell;