首页 > 解决方案 > React js 大日历更改语言天数

问题描述

我正在使用以下模块:react-big-calendar

在我使用它的项目中,用户可以更改系统语言。

我想根据用户选择的语言更改星期几。

链接:Codesanbox

代码:

const React = require("react");
const { Calendar, momentLocalizer } = require("react-big-calendar");
const moment = require("moment");
const localizer = momentLocalizer(moment);

const ReportCalendar = ({ eventList }) => {
  return (
    <Calendar
      localizer={localizer}
      events={eventList}
      startAccessor="start"
      endAccessor="end"
      style={{ height: "550px", width: "850px" }}
    />
  );
};
module.exports = ReportCalendar;

标签: javascriptreactjsreact-big-calendar

解决方案


首先,如果您在项目中使用 I18n,您必须在 i18n 中使用系统的当前语言,您可以在此过程中使用 i18n.language,您可以根据需要导入时刻本地化,例如,在我的情况下,我想更改日历用英语和土耳其语本地化。我的 i18n.language 属性为我的系统语言 en,tr 返回两个值;

import 'moment/locale/en-gb';
import 'moment/locale/tr';


const ReportCalendar = ({ eventList }) => {
return (
   <Calendar
     culture={i18n.language}
     localizer={localizer}
     events={eventList}
     startAccessor="start"
     endAccessor="end"
     style={{ height: "550px", width: "850px" }}
 />

); };

您的代码将如上所示。您可以使用文化属性根据应用程序的语言更改语言


推荐阅读