mirror of https://github.com/ElemeFE/element
fix input-number min max prop && breadcrumb align (#514)
* fix align * fix input number min maxpull/516/head
parent
66842c80e8
commit
8a75e2c833
|
@ -31,7 +31,7 @@
|
|||
:::demo 要使用它,只需要在`el-input-number`元素中使用`v-model`绑定变量即可,变量的初始值即为默认值。
|
||||
```html
|
||||
<template>
|
||||
<el-input-number v-model="num1" @change="handleChange"></el-input-number>
|
||||
<el-input-number v-model="num1" @change="handleChange" :min="1" :max="10"></el-input-number>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
@ -50,7 +50,7 @@
|
|||
:::demo `disabled`属性接受一个`Boolean`,设置为`true`即可禁用整个组件,如果你只需要控制数值在某一范围内,可以设置`min`属性和`max`属性,不设置`min`和`max`时,最小值为 0。
|
||||
|
||||
```html
|
||||
<el-input-number v-model="num1" :disabled="true"></el-input-number>
|
||||
<el-input-number v-model="num2" :disabled="true"></el-input-number>
|
||||
```
|
||||
:::
|
||||
|
||||
|
@ -61,7 +61,7 @@
|
|||
:::demo 设置`step`属性可以控制步长,接受一个`Number`。
|
||||
|
||||
```html
|
||||
<el-input-number v-model="num2" :step="2"></el-input-number>
|
||||
<el-input-number v-model="num3" :step="2"></el-input-number>
|
||||
```
|
||||
:::
|
||||
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
]"
|
||||
>
|
||||
<el-input
|
||||
v-model="currentValue"
|
||||
v-model.number="currentValue"
|
||||
:disabled="disabled"
|
||||
:size="size"
|
||||
:number="true"
|
||||
|
@ -39,9 +39,6 @@
|
|||
export default {
|
||||
name: 'ElInputNumber',
|
||||
props: {
|
||||
value: {
|
||||
default: 1
|
||||
},
|
||||
step: {
|
||||
type: Number,
|
||||
default: 1
|
||||
|
@ -54,6 +51,9 @@
|
|||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
value: {
|
||||
default: 0
|
||||
},
|
||||
disabled: Boolean,
|
||||
size: String
|
||||
},
|
||||
|
@ -89,8 +89,18 @@
|
|||
ElInput
|
||||
},
|
||||
data() {
|
||||
// correct the init value
|
||||
let value = this.value;
|
||||
if (value < this.min) {
|
||||
this.$emit('input', this.min);
|
||||
value = this.min;
|
||||
}
|
||||
if (value > this.max) {
|
||||
this.$emit('input', this.max);
|
||||
value = this.max;
|
||||
}
|
||||
return {
|
||||
currentValue: this.value,
|
||||
currentValue: value,
|
||||
inputActive: false
|
||||
};
|
||||
},
|
||||
|
@ -100,7 +110,7 @@
|
|||
},
|
||||
|
||||
currentValue(newVal, oldVal) {
|
||||
if (!isNaN(newVal) && newVal <= this.max && newVal >= this.min) {
|
||||
if (newVal <= this.max && newVal >= this.min) {
|
||||
this.$emit('change', newVal);
|
||||
this.$emit('input', newVal);
|
||||
} else {
|
||||
|
|
|
@ -5,6 +5,7 @@
|
|||
|
||||
@b breadcrumb {
|
||||
font-size:13px;
|
||||
line-height: 1;
|
||||
@utils-clearfix;
|
||||
|
||||
@e separator {
|
||||
|
|
Loading…
Reference in New Issue