# 数字输入框
# 普通用法
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [
{
label:'数字输入框',
prop:'num',
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy
# 隐藏控制器
设置controls
属性可以隐藏控制器,接受一个Number
。
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [{
label:'数字输入框',
prop:'num',
controls:false,
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy
# 步数
设置step
属性可以控制步长,接受一个Number
。
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [
{
label:'数字输入框',
prop:'num',
step:2,
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy
# 严格步数
stepStrictly
属性接受一个Boolean
。如果这个属性被设置为true
,则只能输入步数的倍数。
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [
{
label:'数字输入框',
prop:'num',
step:2,
stepStrictly:true,
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy
# 精度
设置precision
属性可以控制数值精度,接收一个Number
。
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [
{
label:'数字输入框',
prop:'num',
precision:2,
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy
# 按钮位置
设置 controlsPosition
属性可以控制按钮位置。
<avue-form :option="option" v-model="form"></avue-form>
<script>
export default{
data() {
return {
form: {
num:1
},
option: {
column: [
{
label:'数字输入框',
prop:'num',
controlsPosition:'',
type:'number'
}
]
}
}
}
}
</script>
Expand Copy Copy