如何更改日期选择器语言

npm install react-intl

import React from 'react';
import { IntlProvider, addLocaleData } from 'react-intl';
import enLocaleData from 'react-intl/locale-data/en';
import zhLocaleData from 'react-intl/locale-data/zh';

// 引入日期选择器组件
import DatePicker from './DatePicker';

// 引入语言包
import enMessages from './locales/en.json';
import zhMessages from './locales/zh.json';

// 添加支持的语言
addLocaleData([...enLocaleData, ...zhLocaleData]);

// 定义支持的语言列表
const supportedLanguages = {
  en: enMessages,
  zh: zhMessages,
};

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      locale: 'en', // 默认语言为英文
    };
  }

  // 切换语言
  changeLanguage = (language) => {
    this.setState({ locale: language });
  };

  render() {
    const { locale } = this.state;

    return (
      <IntlProvider locale={locale} messages={supportedLanguages[locale]}>
        <div>
          {/* 日期选择器组件 */}
          <DatePicker />

          {/* 语言切换按钮 */}
          <button onClick={() => this.changeLanguage('en')}>English</button>
          <button onClick={() => this.changeLanguage('zh')}>中文</button>
        </div>
      </IntlProvider>
    );
  }
}

export default App;