Buefy 更改语言环境答案

【问题标题】：Buefy Change LocaleBuefy 更改语言环境
【发布时间】：2019-08-04 17:20:30
【问题描述】：

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

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

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

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

【问题讨论】：

标签： vue.js datepicker momentjs buefy

【解决方案1】：

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

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

您可以将日期格式化为different formats。

更新：要更改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 时，您的日期都会根据您选择的语言重新格式化。

【讨论】：

谢谢，当我选择一个日期时，这确实有效。但是很抱歉我的问题没有更清楚，我可以看到它的措辞很糟糕。我的意思是能够更改日期和数字显示的语言，日期选择器本身以及日期选择器打开的时间。你会知道这个组件是否可以实现吗？

【解决方案2】：

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

<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) 而不是在组件模板中...

【讨论】：