blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-24 18:36:51 +08:00
Code Issues Projects Releases Wiki Activity

docs(Stepper): add more desc (#4340)

Browse Source
This commit is contained in:
neverland 2019-09-03 14:49:08 +08:00 committed by GitHub
parent 45d60aaf88
commit d8bd873318
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/stepper/README.zh-CN.md
View File

@ -1,5 +1,9 @@
# Stepper 步进器 # Stepper 步进器
### 介绍
步进器由增加按钮、减少按钮和输入框组成，用于在一定范围内输入、调整数字
### 引入 ### 引入
``` javascript ``` javascript
@ -13,6 +17,8 @@ Vue.use(Stepper);
### 基础用法 ### 基础用法
通过`v-model`绑定输入值，可以通过`change`事件监听到输入值的变化
```html ```html
<van-stepper v-model="value" /> <van-stepper v-model="value" />
``` ```
@ -29,25 +35,31 @@ export default {
### 步长设置 ### 步长设置
通过`step`属性设置每次点击增加或减少按钮时变化的值，默认为`1`
```html ```html
<van-stepper v-model="value" step="2" /> <van-stepper v-model="value" step="2" />
``` ```
### 限制输入范围 ### 限制输入范围
通过`min`和`max`属性限制输入值的范围
```html ```html
<van-stepper v-model="value" min="5" max="8" /> <van-stepper v-model="value" min="5" max="8" />
``` ```
### 限制输入整数 ### 限制输入整数
设置`integer`属性后，输入框将限制只能输入整数
```html ```html
<van-stepper v-model="value" integer /> <van-stepper v-model="value" integer />
``` ```
### 禁用状态 ### 禁用状态
通过设置`disabled`属性来禁用 stepper 通过设置`disabled`属性来禁用步进器，禁用状态下无法点击按钮或修改输入框
```html ```html
<van-stepper v-model="value" disabled /> <van-stepper v-model="value" disabled />
@ -55,6 +67,8 @@ export default {
### 异步变更 ### 异步变更
如果需要异步地修改输入框的值，可以设置`async-change`属性，并在`change`事件中手动修改`value`
```html ```html
<van-stepper <van-stepper
:value="value" :value="value"
@ -77,6 +91,8 @@ export default {
setTimeout(() => { setTimeout(() => {
Toast.clear(); Toast.clear();
// 注意此时修改 value 后会再次触发 change 事件
this.value = value; this.value = value;
}, 500); }, 500);
} }
@ -105,7 +121,7 @@ export default {
| v-model | 当前输入值 | *string \| number* | 最小值 | - | | v-model | 当前输入值 | *string \| number* | 最小值 | - |
| min | 最小值 | *string \| number* | `1` | - | | min | 最小值 | *string \| number* | `1` | - |
| max | 最大值 | *string \| number* | - | - | | max | 最大值 | *string \| number* | - | - |
| step | 步数 | *string \| number* | `1` | - | | step | 步长 | *string \| number* | `1` | - |
| integer | 是否只允许输入整数 | *boolean* | `false` | - | | integer | 是否只允许输入整数 | *boolean* | `false` | - |
| disabled | 是否禁用步进器 | *boolean* | `false` | - | | disabled | 是否禁用步进器 | *boolean* | `false` | - |
| disable-input | 是否禁用输入框 | *boolean* | `false` | - | | disable-input | 是否禁用输入框 | *boolean* | `false` | - |