mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-12 04:13:13 +08:00
docs: fix InputNumber demos' format
This commit is contained in:
parent
0723b9664c
commit
2c0ed57e5a
@ -1,8 +1,16 @@
|
|||||||
---
|
---
|
||||||
order: 0
|
order: 0
|
||||||
title: basic
|
title:
|
||||||
|
zh-CN: 基本
|
||||||
|
en-US: Basic
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## zh-CN
|
||||||
|
|
||||||
|
数字输入框。
|
||||||
|
|
||||||
|
## en-US
|
||||||
|
|
||||||
Numeric-only input box.
|
Numeric-only input box.
|
||||||
|
|
||||||
````jsx
|
````jsx
|
@ -1,18 +0,0 @@
|
|||||||
---
|
|
||||||
order: 0
|
|
||||||
title: 基本
|
|
||||||
---
|
|
||||||
|
|
||||||
数字输入框。
|
|
||||||
|
|
||||||
````jsx
|
|
||||||
import { InputNumber } from 'antd';
|
|
||||||
|
|
||||||
function onChange(value) {
|
|
||||||
console.log('changed', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
ReactDOM.render(
|
|
||||||
<InputNumber min={1} max={10} defaultValue={3} onChange={onChange} />
|
|
||||||
, mountNode);
|
|
||||||
````
|
|
@ -1,8 +1,16 @@
|
|||||||
---
|
---
|
||||||
order: 3
|
order: 3
|
||||||
title: decimals
|
title:
|
||||||
|
zh-CN: 小数
|
||||||
|
en-US: Decimals
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## zh-CN
|
||||||
|
|
||||||
|
和原生的数字输入框一样,value 的精度由 step 的小数位数决定。
|
||||||
|
|
||||||
|
## en-US
|
||||||
|
|
||||||
A numeric-only input box whose values can be increased or decreased using a decimal step. The number of decimals (also known as precision) is determined by the step prop.
|
A numeric-only input box whose values can be increased or decreased using a decimal step. The number of decimals (also known as precision) is determined by the step prop.
|
||||||
|
|
||||||
````jsx
|
````jsx
|
@ -1,18 +0,0 @@
|
|||||||
---
|
|
||||||
order: 3
|
|
||||||
title: 小数
|
|
||||||
---
|
|
||||||
|
|
||||||
和原生的数字输入框一样,value 的精度由 step 的小数位数决定。
|
|
||||||
|
|
||||||
````jsx
|
|
||||||
import { InputNumber } from 'antd';
|
|
||||||
|
|
||||||
function onChange(value) {
|
|
||||||
console.log('changed', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
ReactDOM.render(
|
|
||||||
<InputNumber min={1} max={10} step={0.1} onChange={onChange} />
|
|
||||||
, mountNode);
|
|
||||||
````
|
|
@ -1,8 +1,16 @@
|
|||||||
---
|
---
|
||||||
order: 2
|
order: 2
|
||||||
title: disabled
|
title:
|
||||||
|
zh-CN: 不可用
|
||||||
|
en-US: Disabled
|
||||||
---
|
---
|
||||||
|
|
||||||
|
## zh-CN
|
||||||
|
|
||||||
|
点击按钮切换可用状态。
|
||||||
|
|
||||||
|
## en-US
|
||||||
|
|
||||||
Click the button to toggle between available and disabled states.
|
Click the button to toggle between available and disabled states.
|
||||||
|
|
||||||
````jsx
|
````jsx
|
@ -1,35 +0,0 @@
|
|||||||
---
|
|
||||||
order: 2
|
|
||||||
title: 不可用
|
|
||||||
---
|
|
||||||
|
|
||||||
点击按钮切换可用状态。
|
|
||||||
|
|
||||||
````jsx
|
|
||||||
import { InputNumber, Button } from 'antd';
|
|
||||||
|
|
||||||
const Test = React.createClass({
|
|
||||||
getInitialState() {
|
|
||||||
return {
|
|
||||||
disabled: true,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
toggle() {
|
|
||||||
this.setState({
|
|
||||||
disabled: !this.state.disabled,
|
|
||||||
});
|
|
||||||
},
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<div>
|
|
||||||
<InputNumber min={1} max={10} disabled={this.state.disabled} defaultValue={3} />
|
|
||||||
<div style={{ marginTop: 20 }}>
|
|
||||||
<Button onClick={this.toggle} type="primary">Toggle disabled</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
ReactDOM.render(<Test />, mountNode);
|
|
||||||
````
|
|
@ -1,10 +1,17 @@
|
|||||||
---
|
---
|
||||||
order: 1
|
order: 1
|
||||||
title: Three sizes
|
title:
|
||||||
|
zh-CN: 三种大小
|
||||||
|
en-US: Sizes
|
||||||
---
|
---
|
||||||
|
|
||||||
There are three sizes available to a numeric input box. By default, the size is `28px`. The two additional sizes are `large` and `small` which means `32px` and `22px`, respectively.
|
## zh-CN
|
||||||
|
|
||||||
|
三种大小的数字输入框,当 size 分别为 `large` 和 `small` 时,输入框高度为 `32px` 和 `22px` ,默认高度为 `28px`
|
||||||
|
|
||||||
|
## en-US
|
||||||
|
|
||||||
|
There are three sizes available to a numeric input box. By default, the size is `28px`. The two additional sizes are `large` and `small` which means `32px` and `22px`, respectively.
|
||||||
|
|
||||||
````jsx
|
````jsx
|
||||||
import { InputNumber } from 'antd';
|
import { InputNumber } from 'antd';
|
@ -1,28 +0,0 @@
|
|||||||
---
|
|
||||||
order: 1
|
|
||||||
title: 三种大小
|
|
||||||
---
|
|
||||||
|
|
||||||
三种大小的数字输入框,当 size 分别为 `large` 和 `small` 时,输入框高度为 `32px` 和 `22px` ,默认高度为 `28px`
|
|
||||||
|
|
||||||
````jsx
|
|
||||||
import { InputNumber } from 'antd';
|
|
||||||
|
|
||||||
function onChange(value) {
|
|
||||||
console.log('changed', value);
|
|
||||||
}
|
|
||||||
|
|
||||||
ReactDOM.render(
|
|
||||||
<div>
|
|
||||||
<InputNumber size="large" min={1} max={100000} defaultValue={3} onChange={onChange} />
|
|
||||||
<InputNumber min={1} max={100000} defaultValue={3} onChange={onChange} />
|
|
||||||
<InputNumber size="small" min={1} max={100000} defaultValue={3} onChange={onChange} />
|
|
||||||
</div>
|
|
||||||
, mountNode);
|
|
||||||
````
|
|
||||||
|
|
||||||
````css
|
|
||||||
.ant-input-number {
|
|
||||||
margin-right: 10px;
|
|
||||||
}
|
|
||||||
````
|
|
Loading…
Reference in New Issue
Block a user