vue.js - Buefy 更改语言环境

Question

我想根据 moment() 语言环境更改日期选择器显示的语言。不仅仅是用户选择的日期的翻译，还有日期选择器本身。

我有一个带有以下日期格式化程序的日期选择器

   <b-datepicker
      :date-formatter="(date) =>  moment(date).locale('ar').format('YYYY-MM-DD')"
   ></b-datepicker>

但我无法让日期选择器更改语言。我已确保事先导入并设置时刻区域设置。

Answer 1

设置语言环境，然后格式化日期，然后再格式化return。

moment(date).locale('ar').format('LLLL');

您可以用不同的格式格式化日期。

更新：要更改moment语言，只需定义反应data属性（例如lang）：

export default {
  data() {
    return {
      lang: "ar"
    }
  }
}

在你的template：

<b-datepicker
  :date-formatter="(date) =>  moment(date).locale(lang).format('YYYY-MM-DD')"
></b-datepicker>

因此，无论何时更改lang，您的日期都会根据您选择的语言重新格式化。

Answer 2

使用month-names和day-names翻译日期选择器。见这里。有了片刻，您可以这样做：

<b-datepicker
  :date-formatter="(date) => moment(date).locale(lang).format('YYYY-MM-DD')"
  :month-names="moment.locale(lang).month()"
  :day-names="moment.locale(lang).weekdaysShort()"
/>

但是您应该在全局范围内定义 locale(lang) 而不是在组件模板中...