Vue 的数据绑定,数据操作

本人新学的Vue,在项目后期进入,在修改一个bug的时候,需要在input中设置必须为数字,且不能为负数。
input type= number,可以解决必须为数字
但是设置不能为负数的时候,出现了问题,因为input自带的min 和max 在form表单外不生效了。而且input的值是v-model绑定的data,根据vue正常思路是去修改this.data,但是有很多数据,就要给每个数据都设置判断,工作量太大。一直想找一个公共的方法
vue

<el-input class="tems_Input textNumber" min="1" type="Number" size="mini" @keyup.native="show('pingTime',$event)" v-model="nei.pingTime"/>

js

show(name,val) {
            let value = val.target.value;
            value = Math.round(value);
            if(value <= 0) {
                value = Math.abs(value);
            }
            this.$set(this,name,value);
        },

现在只需要每个输入框绑定这个show方法,传入参数即可
第一个参数是数据的名称,第二个参数是事件操作的对象
其中注意:$event必须放在后面,如果放在前面传的参数不对,其中原因还是不清楚,$set 和$event需要深入研究下,研究好了在分享给大家。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

躺平,睡觉

苦逼三线前端,给点支持吧。

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值