input只能输入数字

input只能输入0~100数字

环境

vue2、element-ui

template内容

使用@input输入时限制

        <el-table-column label="完成比例(单位：%)">
          <template slot-scope="scope">
            <el-form-item style="margin-bottom: 0px" :prop="'tableData.'+ scope.$index +'.completeRatio'">
              <el-input v-model="scope.row.completeRatio" @input="checkNumber(scope.row)" size="small"></el-input>
            </el-form-item>
          </template>
        </el-table-column>

方法内容

checkNumber(row){
      let reg = /^(0|([1-9]\d{0,1})|100)$/;
      if(reg.test(row.completeRatio) === false){
        row.completeRatio = "";
        return false;
      }
    },

总结

输入完成后，如果不是数字或者超出100都不会显示。