mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-03 04:30:06 +08:00
docs: LocaleProvider, DatePicker 补充时区说明 (#2761)
This commit is contained in:
parent
cf6643ae75
commit
6289d1202b
@ -7,11 +7,11 @@ title:
|
||||
|
||||
## zh-CN
|
||||
|
||||
通过 `locale` 配置时区、语言等, 默认支持 `en_US`,`zh_CN`。
|
||||
通过 `locale` 配置时区、语言等, 默认支持 `en_US`,`zh_CN`。不同版本带有不同的时区配置,如果所在时区与默认配置不同,需要自行设置。上面的 demo 就是在东八区使用 en_US 版本的例子。
|
||||
|
||||
## en-US
|
||||
|
||||
Use locale to set the properties like time zone, language and etc. en_US, zh_CN are supported by default.
|
||||
Use locale to set the properties like time zone, language and etc. `en_US`, `zh_CN` are supported by default. There are different time zone configuration in different versions, you must set it by yourself if your time zone does not match the default setting. The example above is to show how to use the `en_US` version at GMT+8 time zone.
|
||||
|
||||
|
||||
````jsx
|
||||
@ -19,7 +19,7 @@ import { DatePicker } from 'antd';
|
||||
import enUS from 'antd/lib/date-picker/locale/en_US';
|
||||
|
||||
const customLocale = {
|
||||
timezoneOffset: 0 * 60,
|
||||
timezoneOffset: 8 * 60,
|
||||
firstDayOfWeek: 0,
|
||||
minimalDaysInFirstWeek: 1,
|
||||
};
|
||||
|
@ -3,7 +3,7 @@ order: 2
|
||||
title: 所有组件
|
||||
---
|
||||
|
||||
此处列出 Ant Design 中需要国际化支持的组件,你可以在演示里切换语言。
|
||||
此处列出 Ant Design 中需要国际化支持的组件,你可以在演示里切换语言。涉及时间的组件请注意时区设置 [DatePicker](/components/date-picker/#components-date-picker-demo-locale)。
|
||||
|
||||
````jsx
|
||||
import { LocaleProvider, Pagination, DatePicker, TimePicker, Calendar,
|
||||
@ -24,6 +24,12 @@ const columns = [{
|
||||
dataIndex: 'age',
|
||||
}];
|
||||
|
||||
const customLocale = {
|
||||
timezoneOffset: 8 * 60,
|
||||
firstDayOfWeek: 1,
|
||||
minimalDaysInFirstWeek: 1,
|
||||
};
|
||||
|
||||
const Page = React.createClass({
|
||||
getInitialState() {
|
||||
return {
|
||||
@ -104,6 +110,10 @@ const App = React.createClass({
|
||||
this.setState({ locale: e.target.value });
|
||||
},
|
||||
render() {
|
||||
const locale = { ...this.state.locale };
|
||||
if (locale.DatePicker) {
|
||||
locale.DatePicker = { ...locale.DatePicker, ...customLocale };
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<div className="change-locale">
|
||||
@ -113,7 +123,7 @@ const App = React.createClass({
|
||||
<Radio.Button key="cn">中文</Radio.Button>
|
||||
</Radio.Group>
|
||||
</div>
|
||||
<LocaleProvider locale={this.state.locale}><Page /></LocaleProvider>
|
||||
<LocaleProvider locale={locale}><Page /></LocaleProvider>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
|
Loading…
Reference in New Issue
Block a user