要使用它,只需要在el-input-number
元素中使用v-model
绑定变量即可,变量的初始值即为默认值。
<template>
<div>
<el-input-number v-model="inputvalue" :min="1" :max="10"></el-input-number>
</div>
</template>
<script>
export default {
data () {
return {
inputvalue: "1"
};
}
}
</script>
<style>
</style>
disabled
属性接受一个Boolean
,设置为true
即可禁用整个组件,如果你只需要控制数值在某一范围内,可以设置min
属性和max
属性,不设置min
和max
时,最小值为 0。
设置step
属性可以控制步长,接受一个Number
。
step-strictly
属性接受一个Boolean
。如果这个属性被设置为true
,则只能输入步数的倍数。
设置 precision
属性可以控制数值精度,接收一个 Number
。precision
的值必须是一个非负整数,并且不能小于 step
的小数位数。
size 额外提供了 medium
、small
、mini
三种尺寸的数字输入框
设置 controls-position
属性可以控制按钮位置。
<template>
<div>
<el-input-number v-model="inputvalue" :min="1" :max="10" :step="3" step-strictly precision="2"></el-input-number>
<el-input-number size="medium" v-model="inputvalue"></el-input-number>
<el-input-number size="small" v-model="inputvalue"></el-input-number>
<el-input-number size="mini" v-model="inputvalue"></el-input-number>
<div>
<el-input-number controls-position="right"></el-input-number>
</div>
</div>
</template>
<script>
export default {
data () {
return {
inputvalue: "1"
};
}
}
</script>
<style>
</style>
实验效果