kendo-datepicker - 如何在 Kendo react UI 日历库中更改一周的第一天

Question

Kendo React JS 的日历库中默认一周的第一天是Sunday。

希望一周的开始日期应该是星期一。

Answer 1

它使用 IntlProvider 进行本地化，请参阅KendoReact 站点中的文档。在示例中，日历从星期一开始，而不是星期日，因为它使用的是 ES 文化。IntlProvider 向 DatePicker 提供文化，包括一周的第一天。您可以从 CLDR 加载数据，因为它来自他们的 repo。或者先修改它以满足您的需求，然后再加载它。例如：weekData.supplemental.weekData.firstDay.US = 'mon';

这是带有完整代码的此类覆盖示例：

    import * as React from 'react';
    import * as ReactDOM from 'react-dom';

    import { Calendar } from '@progress/kendo-react-dateinputs';
    import { IntlProvider, load } from '@progress/kendo-react-intl';

    import likelySubtags from 'cldr-core/supplemental/likelySubtags.json';
    import currencyData from 'cldr-core/supplemental/currencyData.json';
    import weekData from 'cldr-core/supplemental/weekData.json';

    load(likelySubtags, currencyData, weekData);

    weekData.supplemental.weekData.firstDay.US = 'mon';

    class App extends React.Component {
    render() {
        return (
        <IntlProvider locale={'en-US'}>
            <div className="example-wrapper row">
            <Calendar />
            </div>
        </IntlProvider>
        );
    }
    }

    ReactDOM.render(
    <App />,
    document.querySelector('my-app')
    );

这是上面的实时版本。