<TextInput
            style={styles._text}
            placeholder="请输入卡号"
            placeholderTextColor={'#888'}
            underlineColorAndroid='transparent'
             multiline={true}
             onChangeText={this._onChange.bind(this)}
            value={this.state.inputValue}
            keyboardType='numeric'
           />
//监听输入卡号
    _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
            })
        }
    }

在这里插入图片描述

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐