mathieustan / vue-datepicker

A clean datepicker made with VueJs

Home Page:https://vue-datepicker.netlify.com/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

lang:"zh-cn" no work

rockey2020 opened this issue · comments

[Vue warn]: Error in render: "RangeError: Maximum call stack size exceeded"

const lang_zh_cn = {
lang: 'zh-cn',
weekDays: '日_一_二_三_四_五_六'.split(''),
weekDaysShort: '周日_周一_周二_周三_周四_周五_周六'.split('
'),
weekDaysMin: '日_一_二_三_四_五_六'.split(''),
months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('
'),
monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
formats: {
LT: 'HH:mm',
LTS: 'HH:mm:ss',
L: 'YYYY/MM/DD',
LL: 'YYYY年M月D日',
LLL: 'YYYY年M月D日Ah点mm分',
LLLL: 'YYYY年M月D日ddddAh点mm分',
l: 'YYYY/M/D',
ll: 'YYYY年M月D日',
lll: 'YYYY年M月D日 HH:mm',
llll: 'YYYY年M月D日dddd HH:mm'
},
}

    locale: {
      ...lang_zh_cn
    },
  <VueDatePicker color="#f63f3f" v-if="copy_isShow" v-model="copy_date" :inline="true"
                 :locale="locale"
                 :no-header="true" :no-input="false" button-cancel="取消" button-validate="确定" clearable validate>

  </VueDatePicker>

image

If I change the value of lang "en", it will work. But the month cannot be modified

const lang_zh_cn = {
lang: 'zh-cn',
weekDays: '日_一_二_三_四_五_六'.split(''), weekDaysShort: '周日_周一_周二_周三_周四_周五_周六'.split(''),
weekDaysMin: '日_一_二_三_四_五_六'.split(''), months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split(''),
monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),
formats: {
LT: 'HH:mm',
LTS: 'HH:mm:ss',
L: 'YYYY/MM/DD',
LL: 'YYYY年M月D日',
LLL: 'YYYY年M月D日Ah点mm分',
LLLL: 'YYYY年M月D日ddddAh点mm分',
l: 'YYYY/M/D',
ll: 'YYYY年M月D日',
lll: 'YYYY年M月D日 HH:mm',
llll: 'YYYY年M月D日dddd HH:mm'
},
}

There are error in props wordings :

weekDays => should be weekdays
weekDaysShort=> should be weekdaysShort
...

Clean example for it :

<VueDatePicker v-model="date" :locale="locale" />

<script>
const locale = {
  lang: {
    name: 'it',
    weekdays: 'domenica_lunedì_martedì_mercoledì_giovedì_venerdì_sabato'.split('_'),
    weekdaysShort: 'dom_lun_mar_mer_gio_ven_sab'.split('_'),
    weekStart: 1,
    months: 'gennaio_febbraio_marzo_aprile_maggio_giugno_luglio_agosto_settembre_ottobre_novembre_dicembre'.split('_'),
    monthsShort: 'gen_feb_mar_apr_mag_giu_lug_ago_set_ott_nov_dic'.split('_'),
    formats: {
      LT: 'HH:mm',
      LTS: 'HH:mm:ss',
      L: 'DD/MM/YYYY',
      LL: 'D MMMM YYYY',
      LLL: 'D MMMM YYYY HH:mm',
      LLLL: 'dddd D MMMM YYYY HH:mm',
    },
    ordinal: n => `${n}º`,
    buttonCancel: 'Annulla',
    buttonValidate: 'Ok',
    rangeHeaderText: 'Dalle %d Alle 13',
  },
};

export default {
  // ...
  components: {
    VueDatePicker
  },
  data: () => ({
    date: new Date([2019, 5, 16]),
    locale,
  }),
  // ...
};
</script>

@rockey2020 let me know, if there is still bug with clean locale object.

Close for now. Let me know if there is still a problem.