Fullcalendar 区域设置未更改 header v5 中的栏
Fullcalendar locale not changing header bar in v5
我在更改全日历的 header 工具栏的区域设置时遇到问题。
奇怪的是它适用于月份和日期名称,而不是 header。
代码如下所示:
let calendar = new FullCalendar.Calendar(calendarEl, {
headerToolbar: {
locale: getLanguage(),
left: 'prev,next',
center: 'title',
right: 'timeGridWeek,dayGridMonth,listWeek',
},
initialView: 'timeGridWeek',
weekNumbers: true,
weekText: "",
weekends: false,
firstDay: 1,
slotMinTime: "07:00:00",
slotMaxTime: "18:00:00",
eventTimeFormat: {
hour: '2-digit',
minute: '2-digit',
hour12: false,
},
locale: getLanguage(),
eventDisplay: "block",
eventTextColor: "#fff"
});
getLanguage() returns 浏览器语言,在我的例子中它应该(并且做)return no-NB.
function getLanguage() {
let result = window.localStorage[LANGUAGE];
return result ? result : navigator.language || navigator.userLanguage || 'no';
}
为什么它不改变header工具栏的本地化?
当你谈论 header 工具栏的本地化时,我假设你是在专门谈论按钮中视图的名称,因为 header 的日期部分已经明确已经本地化了。
为什么你的情况没有改变的答案仅仅是因为 fullCalendar 的语言环境文件不包含 no
或 no-NB
(挪威)的条目。因此没有文本 fullCalendar 可以用来替换视图和其他按钮的名称。
在撰写本文时,您可以在 https://cdn.jsdelivr.net/npm/fullcalendar@5.10.1/locales-all.js 查看最新版本,发现没有该区域代码的条目。
但是有一个 nb
的条目,我认为它是挪威语 Bokmål。所以你可以使用它,如果合适的话。
另一种解决方案是修改语言环境文件,为您希望在日历中支持的语言代码添加您自己的条目。 (如果你采用这种方法,你也可以将你的贡献提交给 fullCalendar 项目,看看他们是否会接受它到下一个版本默认提供的文件中。)
另一种替代解决方案是为每个视图创建 custom view settings,您可以在其中定义自己的按钮文本,即使对于 built-in 视图也是如此。
(P.S。在您的示例中日期仍然本地化的原因是因为这实际上是由浏览器的 JavaScript 引擎内置的 JS 日期库完成的。FullCalendar 仅使用的结果那。它的语言环境设置(如果可用)可能会覆盖演示文稿的某些方面,否则它只会使用浏览器默认生成的任何内容。)
我在更改全日历的 header 工具栏的区域设置时遇到问题。
奇怪的是它适用于月份和日期名称,而不是 header。
代码如下所示:
let calendar = new FullCalendar.Calendar(calendarEl, {
headerToolbar: {
locale: getLanguage(),
left: 'prev,next',
center: 'title',
right: 'timeGridWeek,dayGridMonth,listWeek',
},
initialView: 'timeGridWeek',
weekNumbers: true,
weekText: "",
weekends: false,
firstDay: 1,
slotMinTime: "07:00:00",
slotMaxTime: "18:00:00",
eventTimeFormat: {
hour: '2-digit',
minute: '2-digit',
hour12: false,
},
locale: getLanguage(),
eventDisplay: "block",
eventTextColor: "#fff"
});
getLanguage() returns 浏览器语言,在我的例子中它应该(并且做)return no-NB.
function getLanguage() {
let result = window.localStorage[LANGUAGE];
return result ? result : navigator.language || navigator.userLanguage || 'no';
}
为什么它不改变header工具栏的本地化?
当你谈论 header 工具栏的本地化时,我假设你是在专门谈论按钮中视图的名称,因为 header 的日期部分已经明确已经本地化了。
为什么你的情况没有改变的答案仅仅是因为 fullCalendar 的语言环境文件不包含 no
或 no-NB
(挪威)的条目。因此没有文本 fullCalendar 可以用来替换视图和其他按钮的名称。
在撰写本文时,您可以在 https://cdn.jsdelivr.net/npm/fullcalendar@5.10.1/locales-all.js 查看最新版本,发现没有该区域代码的条目。
但是有一个 nb
的条目,我认为它是挪威语 Bokmål。所以你可以使用它,如果合适的话。
另一种解决方案是修改语言环境文件,为您希望在日历中支持的语言代码添加您自己的条目。 (如果你采用这种方法,你也可以将你的贡献提交给 fullCalendar 项目,看看他们是否会接受它到下一个版本默认提供的文件中。)
另一种替代解决方案是为每个视图创建 custom view settings,您可以在其中定义自己的按钮文本,即使对于 built-in 视图也是如此。
(P.S。在您的示例中日期仍然本地化的原因是因为这实际上是由浏览器的 JavaScript 引擎内置的 JS 日期库完成的。FullCalendar 仅使用的结果那。它的语言环境设置(如果可用)可能会覆盖演示文稿的某些方面,否则它只会使用浏览器默认生成的任何内容。)