value is not updating on change when we update the state

[qasimgit]

I have function called on a button and it fetches some values but after fetching when i set it to the state it wont update on front end on TextField , although it is updating the stating but it's onChangeText is not working after it's state is updated through setState

[gabrieldonadel]

Hi @qasimgit, unfortunately this is a known bug in react-native-material-textfield and this lib appears to be abandoned. I suggest you using this fork rn-material-ui-textfield that has fixed this and some other bugs.

If you want to give it a try just run

npm install --save rn-material-ui-textfield

[snd898]

@gabrieldonadel Thank you for the suggestion. It saved me from building a new component from scratch. Thank you so much.

[dariusbiro]

@gabrieldonadel I have been looking for a package that is up to date, but one that, if I decided to use, would not mean I have to change allllllll the inputs. Thank you so much!

[qasimgit]

Solved this issue by ref.

instead of using setState() use ref method

defining the ref in the textField

<TextField ref={ ref => this.textRef = ref } {...props} />

Material TextField provide a prop of setValue( ) which can be called by ref to update the state

this.textRef.setValue( text )

here it is done....

[sarafhbk]

` import React from "react"; import { useRef } from "react"; import { useEffect } from "react"; import { FilledTextField, TextFieldProps, } from "react-native-material-textfield";

const FloatingLabelInput = (props: TextFieldProps) => { const inputRef = useRef(null);

useEffect(() => {
  inputRef.current?.setValue(props?.value);
}, [props?.value]);

return (
  <FilledTextField
    ref={inputRef}
    {...props}
  />
);

};

export default FloatingLabelInput `

This works for me