File tree 1 file changed +11
-11
lines changed
1 file changed +11
-11
lines changed Original file line number Diff line number Diff line change 1
1
# React Tailwindcss Datepicker
2
2
3
- <p align = " center " >
3
+ <p style = " text-align : center " >
4
4
<a href="https://react-tailwindcss-datepicker.vercel.app/" target="_blank">
5
5
<img alt="React Tailwindcss Datepicker" width="100" style="border-radius: 100%;" src="https://raw.githubusercontent.com/onesine/react-tailwindcss-datepicker/master/assets/img/calendar_logo.svg?raw=true">
6
6
</a><br><br>
7
7
A modern date range picker component for React using Tailwind 3 and dayjs. Alternative to Litepie Datepicker which uses Vuejs.
8
8
</p >
9
9
10
- <div align = " center " >
10
+ <div style = " text-align : center " >
11
11
12
12
[ ![ npm version] ( https://img.shields.io/npm/v/react-tailwindcss-datepicker?style=flat-square )] ( https://www.npmjs.com/package/react-tailwindcss-datepicker )
13
13
[ ![ npm downloads] ( https://img.shields.io/npm/dt/react-tailwindcss-datepicker?style=flat-square )] ( https://www.npmjs.com/package/react-tailwindcss-datepicker )
@@ -87,24 +87,24 @@ module.exports = {
87
87
88
88
Then use react-tailwindcss-select in your app:
89
89
90
- ``` jsx
90
+ ``` tsx
91
91
import React , { useState } from " react" ;
92
92
import Datepicker from " react-tailwindcss-datepicker" ;
93
93
94
94
const App = () => {
95
95
const [value, setValue] = useState ({
96
- startDate: new Date () ,
97
- endDate: new Date (). setMonth ( 11 )
96
+ startDate: null ,
97
+ endDate: null
98
98
});
99
99
100
- const handleValueChange = newValue => {
101
- console .log (" newValue:" , newValue);
102
- setValue (newValue);
103
- };
104
-
105
100
return (
106
101
<div >
107
- < Datepicker value= {value} onChange= {handleValueChange} / >
102
+ <Datepicker
103
+ value = { value }
104
+ onChange = { newValue => {
105
+ setValue (newValue );
106
+ }}
107
+ />
108
108
</div >
109
109
);
110
110
};
You can’t perform that action at this time.
0 commit comments