react-native-masked-text
react-native-masked-text copied to clipboard
Property 'isValid' does not exist on type 'TextInputMask'
I get the error TS2339: Property 'isValid' does not exist on type 'TextInputMask'.
when defining the following component:
import React, { useRef, useState } from "react"
import { TextInputMask } from "react-native-masked-text"
import { DateTime } from "luxon"
interface DateTextFieldProps {
onChangeDate: (date: Date) => void
}
export const DateTextField = ({ onChangeDate }: DateTextFieldProps) => {
const [value, setValue] = useState<string>("")
const ref = useRef<TextInputMask>(null)
return (
<TextInputMask
type={"datetime"}
options={{
format: "DD/MM/YYYY",
}}
value={value}
onChangeText={(newValue) => {
setValue(newValue)
if (ref.current?.isValid && ref.current?.isValid()) { // <===== Here happens the typescript error
onChangeDate(DateTime.fromFormat(newValue, "dd/MM/yyyy").toJSDate())
}
}}
keyboardType={"numeric"}
ref={ref}
/>
)
}
I can see isValid() in TextInputMaskMethods, but it seems not to be related to
export class TextInputMask extends React.Component<TextInputMaskProps> {}
// TextInputMaskMethods
export class TextInputMaskMethods {
getElement(): TextInput
getRawValue(): string
isValid(): boolean
}
// TextInputMasked
export type TextInputMasked = TextInputMaskMethods | null
I was able to fix it like this:
type InputMask = TextInputMask & TextInputMaskMethods
const inputRef = useRef<InputMask>(null)