uniapp or WeChat applet intercepts the input box without re-rendering (only input numbers are successfully intercepted but the page is not rendered and updated) the problem is solved

Effect

question

The @input event intercepts and prints that the value of e.target.value has changed, but the page does not re-render.
The following example:
input 11, the value of e.target.value is 11,
input 11a, regular interception, change the value of e.target.value or 11,
input 11ab regular interception, change the value of e.target.value or 11,
input 11ab3 regular Intercept to change the value of e.target.value to 113
because the value after interception has not changed and the page will not be re-rendered

solve

  <input
      class="input"
      type="text"
      placeholder="请输入价格"
      :value="pItem.price"
      @input="handleOnlyNumbersInput($event, pItem, 'price')"
    />
    //data中的属性
    nowNum: 0
    //methods中的handleOnlyNumbersInput函数
    methods:{
    
    
    // 现在只输入 数字
    handleOnlyNumbersInput(e, item, key) {
    
    
      let input = e.target.value;
      const regex = /^[0-9.]*$/; //数字包括小数点
      if (!regex.test(input)) {
    
    
        // e.target.value = input.replace(/[^\d.]/g, '');
        input = input.replace(/[^\d.]/g, '');
        this.nowNum++;
        //来回切换更改 input 值 是为了 使得input内容变化从而使页面渲染
        if (this.nowNum % 2 == 0) {
    
    
          this.$set(item, key, input + ' ');
        } else {
    
    
          this.$set(item, key, ' ' + input);
        }
        if (this.nowNum >= 100000) {
    
    
          this.nowNum = 0;
        }
      }
      this.$nextTick(() => {
    
    
        this.$set(item, key, input);
        // this.$forceUpdate();
      });
    },
    }