mirror of
https://gitee.com/ant-design/ant-design.git
synced 2024-12-02 12:09:14 +08:00
docs: tranlsation of Checkbox (#2740)
This commit is contained in:
Benjy Cui
GitHub
parent
5d36e7e03f
commit
f21033c316
@ -1,10 +1,18 @@
|
||||
---
|
||||
order: 0
|
||||
title: 基本用法
|
||||
title:
|
||||
zh-CN: 基本用法
|
||||
en-US: Basic
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
简单的 checkbox。
|
||||
|
||||
## en-US
|
||||
|
||||
Basic usage of checkbox.
|
||||
|
||||
````jsx
|
||||
import { Checkbox } from 'antd';
|
||||
|
||||
|
||||
@ -1,10 +1,18 @@
|
||||
---
|
||||
order: 2
|
||||
title: 和外部组件通信
|
||||
title:
|
||||
zh-CN: 受控的 Checkbox
|
||||
en-US: Controlled Checkbox
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
联动 checkbox。
|
||||
|
||||
## en-US
|
||||
|
||||
Communicated with other components.
|
||||
|
||||
````jsx
|
||||
import { Checkbox, Button } from 'antd';
|
||||
|
||||
@ -16,7 +24,7 @@ const App = React.createClass({
|
||||
};
|
||||
},
|
||||
render() {
|
||||
const label = `${this.state.checked ? '选中' : '取消'}-${this.state.disabled ? '不可用' : '可用'}`;
|
||||
const label = `${this.state.checked ? 'Checked' : 'Unchecked'}-${this.state.disabled ? 'Disabled' : 'Enabled'}`;
|
||||
return (
|
||||
<div>
|
||||
<p style={{ marginBottom: '20px' }}>
|
||||
@ -31,13 +39,13 @@ const App = React.createClass({
|
||||
<Button type="primary" size="small"
|
||||
onClick={this.toggleChecked}
|
||||
>
|
||||
{!this.state.checked ? '选中' : '取消'}
|
||||
{!this.state.checked ? 'Check' : 'Uncheck'}
|
||||
</Button>
|
||||
<Button style={{ marginLeft: '10px' }}
|
||||
type="primary" size="small"
|
||||
onClick={this.toggleDisable}
|
||||
>
|
||||
{!this.state.disabled ? '不可用' : '可用'}
|
||||
{!this.state.disabled ? 'Disable' : 'Enable'}
|
||||
</Button>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@ -1,10 +1,18 @@
|
||||
---
|
||||
order: 1
|
||||
title: 不可用
|
||||
title:
|
||||
zh-CN: 不可用
|
||||
en-US: Disabled
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
checkbox 不可用。
|
||||
|
||||
## en-US
|
||||
|
||||
Disabled checkbox.
|
||||
|
||||
````jsx
|
||||
import { Checkbox } from 'antd';
|
||||
|
||||
|
||||
@ -1,10 +1,18 @@
|
||||
---
|
||||
order: 3
|
||||
title: Checkbox 组
|
||||
title:
|
||||
zh-CN: Checkbox 组
|
||||
en-US: Checkbox Group
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
方便的从数组生成 Checkbox 组。
|
||||
|
||||
## en-US
|
||||
|
||||
Generate a group of checkboxes from an array.
|
||||
|
||||
````jsx
|
||||
import { Checkbox } from 'antd';
|
||||
const CheckboxGroup = Checkbox.Group;
|
||||
@ -15,14 +23,14 @@ function onChange(checkedValues) {
|
||||
|
||||
const plainOptions = ['Apple', 'Pear', 'Orange'];
|
||||
const options = [
|
||||
{ label: '苹果', value: 'Apple' },
|
||||
{ label: '梨', value: 'Pear' },
|
||||
{ label: '橘', value: 'Orange' },
|
||||
{ label: 'Apple', value: 'Apple' },
|
||||
{ label: 'Pear', value: 'Pear' },
|
||||
{ label: 'Orange', value: 'Orange' },
|
||||
];
|
||||
const optionsWithDisabled = [
|
||||
{ label: '苹果', value: 'Apple' },
|
||||
{ label: '梨', value: 'Pear' },
|
||||
{ label: '橘', value: 'Orange', disabled: false },
|
||||
{ label: 'Apple', value: 'Apple' },
|
||||
{ label: 'Pear', value: 'Pear' },
|
||||
{ label: 'Orange', value: 'Orange', disabled: false },
|
||||
];
|
||||
|
||||
ReactDOM.render(
|
||||
|
||||
31
components/checkbox/index.en-US.md
Normal file
31
components/checkbox/index.en-US.md
Normal file
@ -0,0 +1,31 @@
|
||||
---
|
||||
category: Components
|
||||
type: Form Controls
|
||||
title: Checkbox
|
||||
---
|
||||
|
||||
Checkbox.
|
||||
|
||||
## When To Use
|
||||
|
||||
- Used for selecting multiple values from several options.
|
||||
- If you use only one checkbox, it is the same as using Switch to toggle between two states. The difference is that Switch will trigger the state change directly, but Checkbox just marks the state as changed and this needs to be submitted.
|
||||
|
||||
## API
|
||||
|
||||
### Checkbox
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
|----------|------------------|----------|--------|
|
||||
| checked | Specifies whether the checkbox is selected. | Boolean | false |
|
||||
| defaultChecked | Specifies the initial state: whether or not the checkbox is selected. | Boolean | false |
|
||||
| onChange | The callback function that is triggered when the state changes. | Function(e:Event) | - |
|
||||
|
||||
### Checkbox Group
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
|----------|------------------|----------|--------|
|
||||
| defaultValue | Default selected value | Array | [] |
|
||||
| value | Used for setting the currently selected value. | Array | [] |
|
||||
| options | Specifies options | Array | [] |
|
||||
| onChange | The callback function that is triggered when the state changes. | Function(checkedValue) | - |
|
||||
@ -18,15 +18,15 @@ english: Checkbox
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|----------|------------------|----------|--------|
|
||||
| checked | 指定当前是否选中 | boolean | false |
|
||||
| defaultChecked | 初始是否选中 | boolean | false |
|
||||
| checked | 指定当前是否选中 | Boolean | false |
|
||||
| defaultChecked | 初始是否选中 | Boolean | false |
|
||||
| onChange | 变化时回调函数 | Function(e:Event) | - |
|
||||
|
||||
### Checkbox Group
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
|----------|------------------|----------|--------|
|
||||
| defaultValue | 默认选中的选项 | array | [] |
|
||||
| value | 指定选中的选项| array | [] |
|
||||
| options | 指定可选项 | array | [] |
|
||||
| defaultValue | 默认选中的选项 | Array | [] |
|
||||
| value | 指定选中的选项| Array | [] |
|
||||
| options | 指定可选项 | Array | [] |
|
||||
| onChange | 变化时回调函数 | Function(checkedValue) | - |
|
||||
@ -18,8 +18,8 @@ Radio.
|
||||
|
||||
| Property | Description | Type | optional | Default |
|
||||
|----------------|------------------------------------------|------------|---------|--------|
|
||||
| checked | Specifies whether the current is selected | Boolean | | false |
|
||||
| defaultChecked | Initial whether or not selected | Boolean | | false |
|
||||
| checked | Specifies whether the radio is selected. | Boolean | false |
|
||||
| defaultChecked | Specifies the initial state: whether or not the radio is selected. | Boolean | false |
|
||||
| value | According to value for comparison, to determine whether the selected | String | | none |
|
||||
|
||||
### RadioGroup
|
||||
@ -28,7 +28,7 @@ radio group，wrap a group of `Radio`。
|
||||
|
||||
| Property | Description | Type | optional | Default |
|
||||
|----------------|----------------------------------|-------------------|--------|--------|
|
||||
| onChange | The callback function when the options change | Function(e:Event) | none | none |
|
||||
| value | Used to set the current selected value | String | none | none |
|
||||
| onChange | The callback function that is triggered when the state changes. | Function(e:Event) | none | none |
|
||||
| value | Used for setting the currently selected value. | String | none | none |
|
||||
| defaultValue | Default selected value | String | none | none |
|
||||
| size | Size, only on radio style | String | `large` `default` `small` | `default` |
|
||||
|
||||
Loading…
Reference in New Issue
Block a user