You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

83 lines
1.8 KiB

# 所有组件
- order: 2
此处列出 Ant Design 中需要国际化支持的组件。
---
````jsx
9 years ago
import { LocaleProvider, Pagination, DatePicker, TimePicker, Popconfirm, Table, Modal, Button, Select } from 'antd';
import enUS from 'antd/lib/locale-provider/en_US';
9 years ago
const Option = Select.Option;
const columns = [{
title: 'Name',
dataIndex: 'name',
filters: [{
text: 'filter1',
value: 'filter1',
}],
}, {
title: 'Age',
dataIndex: 'age',
}];
9 years ago
const Page = React.createClass({
getInitialState() {
return {
visible: false,
};
},
showModal() {
this.setState({ visible: true });
},
hideModal() {
this.setState({ visible: false });
},
render() {
return (
<div>
<Pagination defaultCurrent={1} total={50} showSizeChanger />
<DatePicker />
<TimePicker />
<Popconfirm title="Question?">
<a href="#">Click to confirm</a>
</Popconfirm>
<Table dataSource={[]} columns={columns} />
<Button type="primary" onClick={this.showModal}>Show Modal</Button>
<Modal title="Locale Modal" visible={this.state.visible} onCancel={this.hideModal}>
<p>Locale Modal</p>
</Modal>
</div>
);
}
});
9 years ago
const App = React.createClass({
getInitialState() {
return {
locale: enUS,
};
},
changeLocale(locale) {
this.setState({ locale });
},
render() {
return (
<div>
<LocaleProvider locale={this.state.locale}><Page /></LocaleProvider>
<div>
<Select defaultValue={enUS} onChange={this.changeLocale}>
<Option value={enUS}>English</Option>
<Option value={null}>中文</Option>
</Select>
</div>
</div>
);
}
});
ReactDOM.render(<App />, mountNode);
````