el-input-number 参数及各种情况-Toy模板网

这篇具有很好参考价值的文章主要介绍了el-input-number 参数及各种情况。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

·参数说明

		1.el-input-number的使用
		2.禁用按钮 disabled
		3.设置 step
		4.设置严格 step step-strictly
		5.精度设置 precision
		6.按钮大小 size
		7.按钮位置 controls-position

·效果图

el-input-number,vue,vue.js,前端,javascript 文章来源地址https://www.toymoban.com/news/detail-523933.html

	<template>
  <div>
    <div style="width:80%;margin:0 auto">
       <!-- el-input-number -->
        <el-input-number v-model='number' @change='handleChange' :min='1' :max='10'></el-input-number>
        <!-- disabled -->
        <el-input-number v-model='number' @change='handleChange' :min='1' :max='10' disabled></el-input-number>
        <!-- step -->
        <el-input-number v-model='stepNumber' :step='2'></el-input-number>
        <!-- step + step-strictly -->
        <el-input-number v-model='stepNumber' :step='2' step-strictly></el-input-number>
        <!-- precision必须是一个非负整数，并且不能小于step的小数位数 -->
        <el-input-number v-model='floatNumber' :precision='2' :step='0.02'></el-input-number>
        <!-- size -->
        <el-input-number v-model='floatNumber' :precision='2' :step='0.1' size='mini'></el-input-number>
        <!-- controls-position -->
        <el-input-number v-model='number' controls-position='right' :min='1' :max='10'></el-input-number>
        <el-input-number v-model="number" :controls='false' :min="1" :max="10" ></el-input-number>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      number: 1,
      stepNumber: 0,
      floatNumber: 1,
    }
  },
}
</script>


/deep/ .el-input-number .el-input__inner {
  text-align: left; //位置居左
}