大佬们，vue里面 限制input只能输入数字怎么做啊？

Question

大佬们，vue里面 限制input只能输入数字怎么做啊？vue-cli搭建的项目，引入的iview UI框架。

Answer 1

v-model.number

Answer 2

可以参考下面的，目前这个是限制，只能输入数字，小数点只保留2位，限制不能输入空格

<div id="app">
    <input type="text" v-model="a" @input="change(a)" /> 
</div>
<script src="https://cdn.bootcss.com/vue/2.6.10/vue.js"></script>
<script type="text/javascript">
    new Vue({
        el: "#app",
        data: {
            a: ""
        },
        methods: {
            change(val) {
                val = val.replace(/(^\s*)|(\s*$)/g, "")
                if(!val) {
                    this.a = "";
                    return
                }
                var reg = /[^\d.]/g

                // 只能是数字和小数点，不能是其他输入
                val = val.replace(reg, "")

                // 保证第一位只能是数字，不能是点
                val = val.replace(/^\./g, "");
                // 小数只能出现1位
                val = val.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
                // 小数点后面保留2位
                val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');

                this.a = val;
            }
        }
    })
</script>

Answer 3

input 限制数组，不是在 input里面 type设置 number 吗？

或者根据官网
<input v-model.number="age" type="number">

链接：https://cn.vuejs.org/v2/guide...

Answer 4

Vue 原生写法 正则内替换你所需要的内容 现在限制的是只能输入数字

<input type="text" v-model="_msg">
//////////////////////////
<script>
export default {
  name: "auth",
  data(){
    return {
      msg:''
    }
  },
  computed: {
    _msg: {
      set: function(value) {
          this.msg = value;
      },
      get: function() {
          return this.msg.replace(/[^0-9]+/g,'')
      }
    }
  }
};
</script>