嗨老师，请问如何实现银行卡账号输入，每4位空一个空格 ，
我网上查了很多都是加入正则表达式，就是每4位插入一个空格，但是我想保留下面的字数输出，如下图，我担心加正则表达式会把多余的空格当做字符同时被计入：

Component :

import React from 'react';
import { StyleSheet, View } from 'react-native'
import { TextInput } from 'react-native-gesture-handler';
import AppText from './AppText/AppText';
import colors from '../config/colors';

function TitleInput({input_width="100%",...ortherProps}) {
    return (
        <View style={styles.container}>
            <AppText style={styles.title}>银行卡号</AppText>
           <View style={styles.input_container,{width:input_width}}>
           <TextInput
           style={styles.input_text}
           {...ortherProps}
           />
           </View>
        </View>
    );
}

const styles = StyleSheet.create({
    container :{
        flexDirection : 'column',
        padding : 5,
    },
    input_container : {
        borderColor : colors.white,
        borderWidth : 0.5,
        borderColor : colors.primary,
       
      
       
    },
    input_text: {
        fontSize: 16,
        color : colors.medium,
        borderColor : colors.primary,
        borderWidth :0.5,
        marginTop : 10,
        padding :10,
        borderRadius :10,
        
     
    },
    title : {
        fontWeight : 'bold',
    }
})
export default TitleInput;

主页使用：

import React,{useState} from 'react';
import {StyleSheet, View,Text } from 'react-native'
import TitleInput from './TitleInput';
import colors from '../config/colors';


function Visa({title}) {
    const [value,setValue] = useState("");
    return (
        <View style={styles.container}>
          <TitleInput 
          maxLength ={16}
          input_width="98%"
          onChangeText={(text)=>setValue(text)}
          keyboardType ='numeric'
          />
          <View style={styles.num_left}>
          <Text>{value === "" ? "0" : value.length}/16</Text>
          </View>
           
        </View>
    );
}

const styles = StyleSheet.create({
   container : {
       width :"100%",
       height :"100%",
       marginTop : 10,
   } ,
   num_left : {
       alignItems : 'flex-end',
       marginRight : 15,

   }
})
export default Visa;

麻烦帮我看下哈，谢谢老师！