2
0
mirror of https://github.com/tenrok/vue2-datepicker.git synced 2026-05-17 03:59:39 +03:00

docs: add i18n doc

This commit is contained in:
mengxiong10
2019-11-10 22:35:32 +08:00
parent 657c23eeab
commit fc1a8c16f8
3 changed files with 114 additions and 0 deletions
+37
View File
@@ -57,6 +57,43 @@ $ npm install vue2-datepicker --save
</template>
```
## Internationalization
The default language of v3.x is English. If you need other locales.
You can import locale file.
Once you import a locale, it becomes the active locale.
```js
import DatePicker from 'vue2-datepicker';
import 'vue2-datepicker/index.css';
import 'vue2-datepicker/locale/zh-cn';
```
You can override the default locale by `lang`.
[Full config](https://github.com/mengxiong10/vue2-datepicker/blob/master/locale.md)
```html
<script>
export default {
data() {
return {
lang: {
formatLocale: {
firstDayOfWeek: 1,
},
monthBeforeYear: false,
},
};
},
};
</script>
<template>
<date-picker :lang="lang"></date-picker>
</template>
```
### Props
| Prop | Description | Type | Default |
+35
View File
@@ -57,6 +57,41 @@ $ npm install vue2-datepicker --save
</template>
```
## 国际化
v3.x 默认语言是英文. 可以引入语言包切换到中文.
```js
import DatePicker from 'vue2-datepicker';
import 'vue2-datepicker/index.css';
import 'vue2-datepicker/locale/zh-cn';
```
还可以通过`lang`去覆盖默认语言选项.
[完整配置](https://github.com/mengxiong10/vue2-datepicker/blob/master/locale.md)
```html
<script>
export default {
data() {
return {
lang: {
formatLocale: {
firstDayOfWeek: 1,
},
monthBeforeYear: false,
},
};
},
};
</script>
<template>
<date-picker :lang="lang"></date-picker>
</template>
```
### Props
| 属性 | 描述 | 类型 | 默认值 |
+42
View File
@@ -0,0 +1,42 @@
```js
{
// the locale of formatting and parsing function
formatLocale: {
// MMMM
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
// MMM
monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
// dddd
weekdays: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
// ddd
weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
// dd
weekdaysMin: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'],
// first day of week
firstDayOfWeek: 0,
// first week contains January 1st.
firstWeekContainsDate: 1,
// format 'a', 'A'
meridiem: (h: number, _: number, isLowercase: boolean) {
const word = h < 12 ? 'AM' : 'PM';
return isLowercase ? word.toLocaleLowerCase() : word;
},
// parse ampm
meridiemParse: /[ap]\.?m?\.?/i;
// parse ampm
isPM: (input: string) {
return `${input}`.toLowerCase().charAt(0) === 'p';
}
},
// the calendar header, default formatLocale.weekdaysMin
days: [],
// the calendar months, default formatLocale.monthsShort
months: [],
// the calendar title of year
yearFormat: 'YYYY 年',
// the calendar title of month
monthFormat: 'MMM',
// the calendar title of month before year
monthBeforeYear: false,
}
```