docs(NumberKeyboard): add random key order demo (#7844)

This commit is contained in:
neverland
2021-01-02 12:59:55 +08:00
committed by GitHub
parent 5137fcf76f
commit fd385bce9d
5 changed files with 39 additions and 59 deletions
+7 -27
View File
@@ -111,43 +111,23 @@ Use `title` prop to set keyboard title.
/>
```
### Number Random
### Random Key Order
Use `random-key-order` prop to random sort number keypads.
Use `random-key-order` prop to shuffle the order of keys.
```html
<van-cell @touchstart.native.stop="show = true"
>弹出配置随机数字的键盘</van-cell
>
<van-cell @touchstart.native.stop="show = true">
Show Keyboard With Random Key Order
</van-cell>
<van-number-keyboard
:show="show"
:random-key-order="true"
random-key-order
@blur="show = false"
@input="onInput"
@delete="onDelete"
/>
```
```js
import { Toast } from 'vant';
export default {
data() {
return {
show: true,
};
},
methods: {
onInput(value) {
Toast(value);
},
onDelete() {
Toast('删除');
},
},
};
```
### Bind Value
```html
@@ -197,7 +177,7 @@ export default {
| hide-on-click-outside | Whether to hide keyboard when outside is clicked | _boolean_ | `true` |
| get-container `v2.10.0` | Return the mount node for NumberKeyboard | _string \| () => Element_ | - |
| safe-area-inset-bottom | Whether to enable bottom safe area adaptation | _boolean_ | `true` |
| random-key-order | whether to enable random sort number keypads | _boolean_ | `false` |
| random-key-order `v2.12.2` | Whether to shuffle the order of keys | _boolean_ | `false` |
### Events