@olenbetong/react-date-navigate
React component used to navigate dates.
Last updated 2 years ago by bjornarvh .
ISC · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @olenbetong/react-date-navigate 
SYNC missed versions from official npm registry.

react-date-select

React component used to navigate dates.

Installation

An UMD build is published to the global component 'modules/umd/date-select.min.js' and can be included with a script tag. The components are available in the global ReactDateSelect variable.

<script src="/file/component/modules/umd/date-select.min.js" type="text/javascript"></script>
<script type="text/javascript">
const { DateSelect, StatefulDateSelect } = ReactDateSelect;
</script>

If using dynamic imports, there is an ESM build available.

const { importModule } = ob.utils;
const module = '/file/component/modules/esm/date-select.min.js';
const { DateSelect, StatefulDateSelect } = await importModule(module);

Usage

Use the DateSelect component if you wish to control the date state yourself.

class MyComponent extends Rect.Component {
	state = {
		date: new Date()
	};

	handleDateChanged(date) {
		this.setState({ date });
	}

	render() {
		return <DateSelect onChange={(date) => this.handleDateChanged(date)} date={this.state.date}/>
	}
}

If you don't need to control the date yourself, the StatefulDateSelect is a small wrapper around the DateSelect component that will keep the date in its state. You can pass an initial date value to it.

function handleDateChanged(date) {
	dsSomeDataSource.setParameter('filterString', `[Date] = '${date.toISOString()}'`);
	dsSomeDataSource.refreshDataSource();
}

ReactDOM.render(
	<StatefulDateSelect onChange={handleDateChanged} initialDate={yesterday}/>,
	document.querySelector('#dateSelect');
)

Current Tags

  • 1.0.1                                ...           latest (2 years ago)

2 Versions

  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2017 © taobao.org |