Vuejs restricts the input box to enter only 0-100 numbers

 loadNumber: function (event) {
        var el = event.currentTarget;
        var elValue = el.value;
        var reg = /^((?!0)\d{1,2}|100)$/;
        if (!elValue.match(reg)) {
            elValue = "";
            console.log("b")
            return false;
        } else {
            return true;
        }

    }

what I do is re-assign the value after regular judgment, and the problem is that I can"t re-assign the value 

  <input v-model="UploadInfoModel.ER" @keyup="loadNumber($event)" />
Vue.js
Mar.23,2021

personal testing perfectly solves and restricts the input of all characters except numbers
the getter setter of the computed calculation attribute is a very useful attribute 

<input type=text v-model="value2">
data() {
    return {
      value1: "10"
    };
  },
  computed: {
    value2: {
      get() {
        var  value = this.value1.replace(/[^\d]+/g, '');
        if(value<=0){
          return 0
        }else if(value>=100){
          return 100
        }else{
          return value
        }
      },
      set(val) {
        this.value1 = val;
      }
    }
  },

I have a method that can be limited. This is the JQuery version. Do you think it works?
this method solves the problem of input method input and paste directly inputting characters that do not meet the requirements, and provides the function of customizing the maximum and minimum values. 

<input type="text" data-target="1" data-min="0" data-max="5" style="width:54px" class="number-box">
            $(".number-box").on("input",function(event){
                var e=event.originalEvent || event;
                var old=e.target.value;
                var min=parseInt(e.target.dataset.min),max=parseInt(e.target.dataset.max);
                if(e.data && !isNaN(old)){
                    //console.info(old,min,max,old>max || old<min);
                    if(old>max || old<min){
                        e.target.value=old.substring(0,old.length-1);
                    }else{
                        e.target.value=parseInt(old);
                    }
                }else{
                    var tmp;
                    for(var i=old.length;i>0;i--){
                        tmp=old.substring(0,i);
                        //console.info(tmp)
                        if(!isNaN(tmp) && tmp<=max && tmp>=min){
                            e.target.value=tmp;
                            break;
                        }
                        if(tmp.length==1)e.target.value="";
                    }
                }
            });

try to split v-model to @ input= "function": value= "UploadInfoModel.ER"
in addition, what is the response method of @ keyup return true to do

?

Previous: Error in docker-compose build

Next: The ajax request for an interface to be passed into headers can only be successfully responded to on Google browser. Why is this?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu