Skip to content

Commit 03f159e

Browse files
darrenfangdarrenfang
committed
update readme
1 parent 3c84e1c commit 03f159e

File tree

1 file changed

+25
-27
lines changed

1 file changed

+25
-27
lines changed

‎README.md‎

Lines changed: 25 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -6,10 +6,10 @@
66

77
DatetimePicker component for Vuetify.js.
88

9-
[Use this for Vuetify 1.5.x.](https://github.com/darrenfang/vuetify-datetime-picker/tree/v1.x 'Use this for Vuetify 1.5.x.')
10-
119
[Online Demo](http://darrenfang.github.io/vuetify-datetime-picker/ 'Online Demo')
1210

11+
[Demo Source Code](https://github.com/darrenfang/vuetify-datetime-picker/blob/master/src/app.vue 'Demo Source Code')
12+
1313
## Installation
1414

1515
```shell
@@ -23,11 +23,13 @@ yarn add vuetify-datetime-picker
2323
```js
2424
import Vue from 'vue'
2525
import DatetimePicker from 'vuetify-datetime-picker'
26-
import 'vuetify-datetime-picker/src/stylus/main.styl'
26+
// (Optional) import 'vuetify-datetime-picker/src/stylus/main.styl'
2727

2828
Vue.use(DatetimePicker)
2929
```
3030

31+
If use the `main.styl`, you should configure the `stylus-loader` in `webpack.config.js`, or just ignore this style sheet.
32+
3133
## Usage
3234

3335
Once installed, it can be used in a template as simply as:
@@ -38,25 +40,20 @@ Once installed, it can be used in a template as simply as:
3840

3941
## Properties
4042

41-
| Name | Type | Default Value | Description |
42-
| ---------------- | ------------- | ------------------- | --------------------------------------------------------------------------------------- |
43-
| datetime (model) | Date/String | | Time picker model. |
44-
| disabled | Boolean | false | Input is disabled. |
45-
| label | string | | Sets input label. |
46-
| width | Number | 340 | The width of the content. |
47-
| format | string | YYYY-MM-DD HH:mm:ss | Defines the format of a datetime displayed in field. |
48-
| timePickerFormat | string | 24hr | Defines the format of a time displayed in picker. Available options are ampm and 24hr. |
49-
| locale | string | en-us | Sets the locale. Accepts a string with a BCP 47 language tag. |
50-
| okText | string | OK | Sets the text of the ok button. |
51-
| clearText | string | CLEAR | Sets the text of the clear button. |
52-
| loading | Boolean | false | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
53-
| errorMessages | String/Array | | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
54-
| errorCount | Number/String | 1 | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
55-
| error | Boolean | false | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
56-
| hideDetails | Boolean | false | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
57-
| appendIcon | String | | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
58-
| prependIcon | String | | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
59-
| useSeconds | Boolean | false | see [Vuetify Docs](https://vuetifyjs.com/zh-Hans/components/text-fields 'Vuetify Docs') |
43+
| Name | Type | Default Value | Description |
44+
| ---------------- | ----------- | ------------- | ----------------------------------------------------------------------------------------------------------- |
45+
| datetime (model) | Date/String | | Time picker model. |
46+
| disabled | Boolean | false | Input is disabled. |
47+
| loading | Boolean | false | Input is loading. |
48+
| label | string | | Sets input label. |
49+
| dialogWidth | Number | 340 | The width of the dialog. |
50+
| dateFormat | string | yyyy-MM-dd | Defines the format of a date. |
51+
| timeFormat | string | HH:mm | Defines the format of a time. |
52+
| clearText | string | CLEAR | Sets the text of the clear button. |
53+
| okText | string | OK | Sets the text of the ok button. |
54+
| textFieldProps | Object | | Text fields properties. See [Vuetify Docs](https://vuetifyjs.com/en/components/text-fields 'Vuetify Docs') |
55+
| datePickerProps | Object | | Date pickers properties.See [Vuetify Docs](https://vuetifyjs.com/en/components/date-pickers 'Vuetify Docs') |
56+
| timePickerProps | Object | | Time pickers properties.See [Vuetify Docs](https://vuetifyjs.com/en/components/time-pickers 'Vuetify Docs') |
6057

6158
## Events
6259

@@ -66,8 +63,9 @@ Once installed, it can be used in a template as simply as:
6663

6764
## Slots
6865

69-
| Name | Description |
70-
| -------- | ----------------------------------------- |
71-
| dateIcon | Slot to put custom icon in the date tab. |
72-
| timeIcon | Slot to put custom icon in the time tab. |
73-
| actions | Slot to put custom buttons in the dialog. |
66+
| Name | Description |
67+
| -------- | ------------------------------------------------------------------------------------------- |
68+
| dateIcon | Slot to put custom icon in the date tab. |
69+
| timeIcon | Slot to put custom icon in the time tab. |
70+
| actions | Slot to put custom buttons in the dialog. |
71+
| progress | Slot for custom progress linear (displayed when loading prop is not equal to Boolean False) |

0 commit comments

Comments
 (0)