uni uView input 数字input 事件 console一变 页面值为变

因为uniapp使用 Vue.js,所以我们在监听input和blur的事件,把用户输入的值进行了修改,发现console.log打印发现值已经修改了,但是页面展示没有发生变化,因为受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除,我们可以异步修改,利用this.$nextTick

/**
 * @description: 数字输入框的限制
 * @author: 包旭慧
 * @param {*} value//限制的值
 * @param {*} numFixd//保留小数点位数
 * @param {*} valueLength//可输入的字符串长度
 * @param {*} maxValue//可输入的字符串最大值
 * @param {*} row//数据来源的对象
 * @param {*} valName//数据来源Key
 * @param {*} 是否限制 输入制 不能输入 0 //数据来源Key
 * @return {*}
 */
export function numberInput(value, numFixd, valueLength, maxValue, row, valName, isZero) {
    if (isNaN(value)) {
        value = parseFloat(value)
    }
    if (isZero == true) {
        if (value.indexOf('0') == 0) {
            value = value.slice(1)
        }
    }
    if (value < 0) {
        value = Number(0).toFixed(numFixd)
    }
    if (numFixd > 0) {
        if (value.indexOf('.') > -1) {
            if (value.indexOf('.') > valueLength) {
                value = value.slice(0, valueLength) + value.slice(valueLength, value.indexOf('.') + numFixd)
            } else {
                value = value.slice(0, valueLength) + value.slice(valueLength, value.indexOf('.') + numFixd + 1)
            }
        } else {
            if (value.length > valueLength) {
                value = value.slice(0, valueLength)
            }
        }
    } else {
        if (value.length > valueLength) {
            value = value.slice(0, valueLength)
        }
    }
    if (maxValue) {
        if (value >= maxValue) {
            value = maxValue.toFixed(numFixd)
        }
    }
//
    this.$nextTick(()=>{
        row[valName] = value
    })
    return row
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • uni-app的基本使用 基础部分: +环境搭建 +页面外观配置 +数据绑定 +uni-app的生命周期 +组件的...
    你的胡霸霸阅读 697评论 0 2
  • 重点知识全面复习 1. js基础 函数作用域(4)定义在函数内的变量和常量统统成为局部作用域 因为只能在函数内...
    若雨千寻阅读 597评论 0 1
  • 前言 为了金三银四的跳槽季做准备,并且我是vue技术栈的,所以整理了若干个vue的面试题。 每次看别人的博客,都会...
    93ac81ebff1e阅读 259评论 0 1
  • VUE Vue :数据驱动的M V Vm框架 m :model(后台提供数据),v :view(页面),vM(模板...
    wudongyu阅读 5,451评论 0 11
  • 业务扩展,IOS和安卓都有成型的版本,所以要做一个对应的移动端H5版的机票订,买票应用,入口是微信公众号,当然少不...
    LorenaLu阅读 351评论 0 0