Reactstrap Core Date Pickers
-Component made with the use of React-Datetime.
Description
We’ve made the following date picker components using various
reactstrap
components,
react-datetime
, and
Bootstrap
classes and also some custom
scss
/css
classes.
Example
If you wish to make your own component out of the
react-datetime
plugin, please check its own docs
here, or on our plugins section
here.
Unfortunately, we are experiencing some difficulties with our live preview docs, and for some reason, the code demo does not work for this plugin and components. Please check them out here.
Date Time
import React from "react";
// reactstrap components
// import {
//
// } from "reactstrap";
// Core Components
import DateTime from "components/date-pickers/DateTime.js";
function Example() {
return (
<>
<DateTime />
</>
);
}
export default Example;
Only Time
import React from "react";
// reactstrap components
// import {
//
// } from "reactstrap";
// Core Components
import OnlyTime from "components/date-pickers/OnlyTime.js";
function Example() {
return (
<>
<OnlyTime />
</>
);
}
export default Example;
Only Date
import React from "react";
// reactstrap components
// import {
//
// } from "reactstrap";
// Core Components
import OnlyDate from "components/date-pickers/OnlyDate.js";
function Example() {
return (
<>
<OnlyDate />
</>
);
}
export default Example;
Range
import React from "react";
// reactstrap components
// import {
//
// } from "reactstrap";
// Core Components
import Range from "components/date-pickers/Range.js";
function Example() {
return (
<>
<Range />
</>
);
}
export default Example;
Note
You should note, that none of the bellow components are dynamic, as we do not know what your end use case will be. Feel free to change it, add your own props and dynamic code.