React Hooks：如何修改react-dates日历组件的语言？

react-dates 依赖 moment.js 实现日期本地化，要切换为巴西葡萄牙语，按以下步骤操作即可：

1. 配置moment的巴西葡萄牙语环境 #

首先确保已安装moment，若未安装先执行：

npm install moment --save

在组件文件顶部导入并初始化巴西葡萄牙语语言包：

import moment from 'moment';
import 'moment/locale/pt-br';

// 全局设置moment本地化语言为巴西葡萄牙语
moment.locale('pt-br');

2. 调整DateRangePicker组件属性 #

在现有代码基础上，添加适配巴西葡萄牙语的格式属性，确保日历的月份、星期显示符合当地习惯：

<S.Container>
  <DateRangePicker
    startDatePlaceholderText="Ida"
    endDatePlaceholderText="Volta"
    showDefaultInputIcon
    orientation={orientation}
    withFullScreenPortal={withFullScreenPortal}
    startDate={startDate}
    startDateId="date-start-date"
    endDate={endDate}
    endDateId="date-end-date"
    onDatesChange={handleDatesChange}
    focusedInput={focusedInput}
    onFocusChange={(focusedInput) => setFocusedInput(focusedInput)}
    numberOfMonths={numberOfMonths}
    displayFormat="DD/MM/YYYY"
    dayAriaLabelFormat="DD/MM/YYYY"
    disabled={!isTwoWays && "endDate"}
    autoFocus={false}
    // 新增本地化适配属性
    monthFormat="MMMM YYYY" // 显示完整月份名称（自动转为葡语）
    weekdayFormat="dd" // 显示星期缩写（自动转为葡语）
    firstDayOfWeek={0} // 巴西以周日作为一周起始日
  />
</S.Container>

3. 效果验证 #

完成配置后，日历中的月份名称（如Janeiro、Fevereiro）、星期缩写（如Dom、Seg）会自动切换为巴西葡萄牙语，日期格式也符合当地使用习惯。

补充说明 #

react-dates的本地化逻辑完全依赖moment.js的语言包，只要正确加载并设置moment的locale，组件会自动应用对应语言翻译，仅需调整格式类属性匹配当地使用习惯即可。

内容的提问来源于stack exchange，提问作者user270284