docs: fix InputNumber demos' format
parent
0723b9664c
commit
2c0ed57e5a
@ -1,8 +1,16 @@
|
||||
---
|
||||
order: 0
|
||||
title: basic
|
||||
title:
|
||||
zh-CN: 基本
|
||||
en-US: Basic
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
数字输入框。
|
||||
|
||||
## en-US
|
||||
|
||||
Numeric-only input box.
|
||||
|
||||
````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: 2
|
||||
title: disabled
|
||||
title:
|
||||
zh-CN: 不可用
|
||||
en-US: Disabled
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
点击按钮切换可用状态。
|
||||
|
||||
## en-US
|
||||
|
||||
Click the button to toggle between available and disabled states.
|
||||
|
||||
````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
|
||||
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
|
||||
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