react-pikaday
A component wrapper around Pikaday.
Importing
Normal
If you're using Browserify, or want to bring a custom Pikaday stylesheet, just require this component like any other module:
var Pikaday = require('react-pikaday');Bundled
If you're using webpack with a configured style-loader for CSS, you can actually require this component along with the Pikaday CSS in one go:
var Pikaday = require('react-pikaday/bundled');Usage
/** @jsx React.DOM */
var React = require('react');
var Pikaday = require('react-pikaday');
var MyComponent = React.createClass({
getInitialState: function() {
return {
date: null
};
},
handleChange: function(date) {
this.setState({
date: date
});
},
render: function() {
var date = this.state.date;
return (
<div>
<p>
The date is {date.toDateString()}
</p>
<Pikaday value={date} onChange={this.handleChange} />
</div>
);
}
});Properties
value |
A Date object to set the currently-displayed date to. |
onChange |
A callback called when the date is updated by the user. Passes a Date object as the first argument. |
valueLink |
Instead of manually hooking up value/onChange to a state variable, you can instead use LinkedStateMixin to bind the two. |
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent