mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 09:26:06 +08:00
feat(input-number): add keyboard prop to support disable keyboard (#29110)
This commit is contained in:
Kermit
GitHub
parent
074f2228cb
commit
53797cf058
@ -411,6 +411,99 @@ Array [
|
||||
]
|
||||
`;
|
||||
|
||||
exports[`renders ./components/input-number/demo/keyboard.md correctly 1`] = `
|
||||
Array [
|
||||
<div
|
||||
class="ant-input-number"
|
||||
>
|
||||
<div
|
||||
class="ant-input-number-handler-wrap"
|
||||
>
|
||||
<span
|
||||
aria-label="Increase Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-up"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="up"
|
||||
class="anticon anticon-up ant-input-number-handler-up-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="up"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
aria-label="Decrease Value"
|
||||
class="ant-input-number-handler ant-input-number-handler-down"
|
||||
role="button"
|
||||
unselectable="on"
|
||||
>
|
||||
<span
|
||||
aria-label="down"
|
||||
class="anticon anticon-down ant-input-number-handler-down-inner"
|
||||
role="img"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="ant-input-number-input-wrap"
|
||||
>
|
||||
<input
|
||||
aria-valuemax="10"
|
||||
aria-valuemin="1"
|
||||
aria-valuenow="3"
|
||||
autocomplete="off"
|
||||
class="ant-input-number-input"
|
||||
max="10"
|
||||
min="1"
|
||||
role="spinbutton"
|
||||
step="1"
|
||||
value="3"
|
||||
/>
|
||||
</div>
|
||||
</div>,
|
||||
<div
|
||||
style="margin-top:20px"
|
||||
>
|
||||
<button
|
||||
class="ant-btn ant-btn-primary"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
Toggle keyboard
|
||||
</span>
|
||||
</button>
|
||||
</div>,
|
||||
]
|
||||
`;
|
||||
|
||||
exports[`renders ./components/input-number/demo/size.md correctly 1`] = `
|
||||
<div
|
||||
class="site-input-number-wrapper"
|
||||
|
||||
45
components/input-number/demo/keyboard.md
Normal file
45
components/input-number/demo/keyboard.md
Normal file
@ -0,0 +1,45 @@
|
||||
---
|
||||
order: 5
|
||||
title:
|
||||
zh-CN: 键盘行为
|
||||
en-US: Keyboard
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
使用 `keyboard` 属性可以控制键盘行为。
|
||||
|
||||
## en-US
|
||||
|
||||
Control keyboard behavior by `keyboard`.
|
||||
|
||||
```jsx
|
||||
import { InputNumber, Button } from 'antd';
|
||||
|
||||
class App extends React.Component {
|
||||
state = {
|
||||
keyboard: true,
|
||||
};
|
||||
|
||||
toggle = () => {
|
||||
this.setState({
|
||||
keyboard: !this.state.keyboard,
|
||||
});
|
||||
};
|
||||
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<InputNumber min={1} max={10} keyboard={this.state.keyboard} defaultValue={3} />
|
||||
<div style={{ marginTop: 20 }}>
|
||||
<Button onClick={this.toggle} type="primary">
|
||||
Toggle keyboard
|
||||
</Button>
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
ReactDOM.render(<App />, mountNode);
|
||||
```
|
||||
@ -20,6 +20,7 @@ When a numeric value needs to be provided.
|
||||
| defaultValue | The initial value | number | - | - |
|
||||
| disabled | If disable the input | boolean | false | - |
|
||||
| formatter | Specifies the format of the value presented | function(value: number \| string): string | - | - |
|
||||
| keyboard | If enable keyboard behavior | boolean | true | 4.12.0 |
|
||||
| max | The max value | number | [Number.MAX_SAFE_INTEGER](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER) | - |
|
||||
| min | The min value | number | [Number.MIN_SAFE_INTEGER](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER) | - |
|
||||
| parser | Specifies the value extracted from formatter | function(string): number | - | - |
|
||||
|
||||
@ -23,6 +23,7 @@ cover: https://gw.alipayobjects.com/zos/alicdn/XOS8qZ0kU/InputNumber.svg
|
||||
| defaultValue | 初始值 | number | - | - |
|
||||
| disabled | 禁用 | boolean | false | - |
|
||||
| formatter | 指定输入框展示值的格式 | function(value: number \| string): string | - | - |
|
||||
| keyboard | 是否启用键盘快捷行为 | boolean | true | 4.12.0 |
|
||||
| max | 最大值 | number | [Number.MAX_SAFE_INTEGER](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/MAX_SAFE_INTEGER) | - |
|
||||
| min | 最小值 | number | [Number.MIN_SAFE_INTEGER](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Number/MIN_SAFE_INTEGER) | - |
|
||||
| parser | 指定从 `formatter` 里转换回数字的方式，和 `formatter` 搭配使用 | function(string): number | - | - |
|
||||
|
||||
@ -126,7 +126,7 @@
|
||||
"rc-dropdown": "~3.2.0",
|
||||
"rc-field-form": "~1.18.0",
|
||||
"rc-image": "~5.1.1",
|
||||
"rc-input-number": "~6.1.0",
|
||||
"rc-input-number": "~6.2.0",
|
||||
"rc-mentions": "~1.5.0",
|
||||
"rc-menu": "~8.10.0",
|
||||
"rc-motion": "^2.4.0",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user