react-native-mask-text icon indicating copy to clipboard operation
react-native-mask-text copied to clipboard

I can't erase the typed value, I don't have access to the value field which is common in inputText.

Open marciojs186 opened this issue 3 years ago • 3 comments

How do I delete the input text value, I can't at all.

marciojs186 avatar Jan 05 '22 14:01 marciojs186

+1

vxxvvxxv avatar Feb 04 '22 08:02 vxxvvxxv

+1 Same here, I pass an initial value to the input and its not showing it. The "value" prop doesn't work.

dleonven avatar Feb 04 '22 14:02 dleonven

@marciojs186 @vxxvvxxv @dleonven Hope this helps. Use the ref to clear the initial value.

  const [value, setValue] = useState('')
  const inputRef = createRef<TextInput>()
  
  useEffect(() => {
    // this is a fix for when masked input would force value 0 instead of placeholder
    if (value === '0') {
      inputRef.current?.clear()
    }
  }, [inputRef, value])

  return (
    ...
      <MaskedInput 
        ref={inputRef}
        type="currency" // it only works if type is currency
        placeholder={'initial value'}
        onChangeText={(text, rawText) => {
          setValue(rawText)
        }}
        value={value}
      />
    ...
  )

yarapolana avatar Mar 16 '22 21:03 yarapolana