blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-05-23 15:09:16 +08:00
Code Issues Projects Releases Wiki Activity

[Improvement] Stepper: add interger prop (#951)

Browse Source
This commit is contained in:
neverland 2018-04-27 22:57:28 +08:00 committed by GitHub
parent e25f98540d
commit fa8f88c7be
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 39 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
docs/demos/views/stepper.vue
View File

@ -9,7 +9,14 @@
</demo-block> </demo-block>
<demo-block :title="$t('advancedUsage')"> <demo-block :title="$t('advancedUsage')">
<van-stepper v-model="stepper2" :min="5" :max="40" :step="2" :default-value="9" /> <van-stepper
v-model="stepper2"
interger
:min="5"
:max="40"
:step="2"
:default-value="9"
/>
</demo-block> </demo-block>
</demo-section> </demo-section>
</template> </template>

18
docs/markdown/en-US/stepper.md
View File

@ -36,6 +36,7 @@ export default {
```html ```html
<van-stepper <van-stepper
v-model="value" v-model="value"
interger
:min="5" :min="5"
:max="40" :max="40"
:step="2" :step="2"
@ -45,14 +46,15 @@ export default {
### API ### API
| Attribute | Description | Type | Default | Accepted Values | | Attribute | Description | Type | Default |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|
| min | Min value | `String | Number` | `1` | - | | min | Min value | `String | Number` | `1` |
| max | Max value | `String | Number` | - | - | | max | Max value | `String | Number` | - |
| default-value | Default value | `String | Number` | `1` | - | | default-value | Default value | `String | Number` | `1` |
| step | Value change step | `String | Number` | `1` | - | | step | Value change step | `String | Number` | `1` |
| disabled | Disable value change | `Boolean` | `false` | - | | interger | Whether to allow only integers | `Boolean` | `false` |
| disable-input | Disable input | `Boolean` | `false` | - | | disabled | Disable value change | `Boolean` | `false` |
| disable-input | Disable input | `Boolean` | `false` |
### Event ### Event

18
docs/markdown/zh-CN/stepper.md
View File

@ -39,6 +39,7 @@ export default {
```html ```html
<van-stepper <van-stepper
v-model="value" v-model="value"
interger
:min="5" :min="5"
:max="40" :max="40"
:step="2" :step="2"
@ -48,14 +49,15 @@ export default {
### API ### API
| 参数 | 说明 | 类型 | 默认值 | 可选值 | | 参数 | 说明 | 类型 | 默认值 |
|-----------|-----------|-----------|-------------|-------------| |-----------|-----------|-----------|-------------|
| min | 最小值 | `String | Number` | `1` | - | | min | 最小值 | `String | Number` | `1` |
| max | 最大值 | `String | Number` | - | - | | max | 最大值 | `String | Number` | - |
| default-value | 默认值 | `String | Number` | `1` | - | | default-value | 默认值 | `String | Number` | `1` |
| step | 步数 | `String | Number` | `1` | - | | step | 步数 | `String | Number` | `1` |
| disabled | 是否禁用 | `Boolean` | `false` | - | | interger | 是否只允许输入整数 | `Boolean` | `false` |
| disable-input | 是否禁用input框 | `Boolean` | `false` | - | | disabled | 是否禁用 | `Boolean` | `false` |
| disable-input | 是否禁用input框 | `Boolean` | `false` |
### Event ### Event

19
packages/stepper/index.vue
View File

@ -10,6 +10,7 @@
:value="currentValue" :value="currentValue"
:disabled="disabled || disableInput" :disabled="disabled || disableInput"
@input="onInput" @input="onInput"
@keypress="onKeypress"
> >
<button <button
:class="b('plus', { disabled: plusDisabled })" :class="b('plus', { disabled: plusDisabled })"
@ -26,6 +27,7 @@ export default create({
props: { props: {
value: {}, value: {},
interger: Boolean,
disabled: Boolean, disabled: Boolean,
disableInput: Boolean, disableInput: Boolean,
min: { min: {
@ -88,14 +90,9 @@ export default create({
methods: { methods: {
correctValue(value) { correctValue(value) {
if (Number.isNaN(value)) { return Number.isNaN(value)
value = this.min; ? this.min
} else { : Math.max(this.min, Math.min(this.max, value));
value = Math.max(this.min, value);
value = Math.min(this.max, value);
}
return value;
}, },
onInput(event) { onInput(event) {
@ -118,6 +115,12 @@ export default create({
this.$emit(type); this.$emit(type);
}, },
onKeypress(event) {
if (this.interger && event.keyCode === 46) {
event.preventDefault();
}
},
emitInput() { emitInput() {
this.$emit('input', this.currentValue); this.$emit('input', this.currentValue);
this.$emit('change', this.currentValue); this.$emit('change', this.currentValue);