I want to create a React Native input component for a credit card expiration date.
I believe I should input mask should be in the format for MM/YY. I'm not sure about autofill with autoCompleteType="cc-exp"
and textContentType="creditCardNumber"
.
How can this be done without a library and only javascript/typescript?
InputCreditCardExpirationDate.tsx
// React Hooks: State const [value, setValue] = useState<string>(''); const formatMMY = (string: string): string => { // HOW? }; // On Change const onChange = (text: string): void => { // MM/YY text = formatMMY(text); if (text.length >= 1) { // Set State setValue(text); // Props: On Change Text onChangeText(text); } }; return (<Input value={value} placeholder={placeholder || 'Expires'} label={label ? label : 'Expires'} keyboardType="numeric" onChangeText={onChange} autoCompleteType="cc-exp" // Android Only textContentType="creditCardNumber" // iOS Only maxLength={7} darkMode={darkMode || false} /> );