React-Native输入数字,每4个隔一个空格,回删bug 解决


//监听输入卡号
    _onChange(value) {
        var str = '' ;
        //输入数字长度大于输入框内长度,每4个就一个空格
        if(value.length > this.state.inputValue.length){
            var reg =   /\s/g;//加入正则,过滤掉字符串中的空格
            value.replace( reg, "").split('').map(function (item,index) {
                (index+1) % 4 == 0 ? str = str + item + ' ': str += item;
            })
            this.setState({
                inputValue: str
            })
            return str;
        } else { 
        // 通过这样判断回删才会正常,不然会一直卡在空格位置
            this.setState({
                inputValue: value
            })
        }
    }

React-Native输入数字,每4个隔一个空格,回删bug 解决_第1张图片

你可能感兴趣的:(ReactNative)